/*
  Theme Name:        CSRTech: CSRTech
  Theme URI:         https://csrtech.com/
  Author:            Ray W. Johnson
  Author URI:        https://csrtech.com/about/
  Description:       Theme for CSRTech.com
  Tags:              csrtech, csrtci, support, rayj
  Version:           1.0.0
  Requires at least: 6.0
  Tested up to:      7.0
  Requires PHP:      8.0
  License:           Copyright(c) 2024 CSR Tech Concepts Inc All Rights Reserved.
  License URI:       https://csrtech.com/licensing/
  Text Domain:       csrtech-csrtech
*/

:root {

  --prime: #4BF;
  --main: #E9F7FF;
  --body: #09F;

  --blue-color: #00F;
  --base-color: #FFF;
  --lite-color: #EEE;
  --dark-color: #333;

  --element-bdr: #333;
  --element-bgc: #F3F3F3;
  --element-hov: #A5A5A5;
  --element-sel: #C6C6C6;

  --shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;

  --money: #080;
  --money-bright: #0F0;
  --money-bg: #EFF;

  --link-sel: #333;


  --x-font-size: 1rem;

  --x-main-color: #256DB3;
  --x-main-hover: #004587;
  --x-main-selected: #3996F1;

  --x-input-backgound: #FAFAFA;
  --x-input-border: #1C5D8A;

  --x-font-lite-color: #EEF9FF;
  --x-font-dark-color: #4D4D4D;

  --x-lite-blue: #EEF9FF;
}

/* Add your custom CSS below this line */

html, body {
  padding: 0;
  border: 0;
  margin: 0;
}

body {
  background-color: var(--body);
/*
  background: url('bg.webp') center center / cover no-repeat fixed;
*/
}

#af-wrapper .error:has(#notice-pub-only) { all: initial; }
#forum-navigation > .home-link { display: none !important; }

#notice-pub-only  {
  margin: 0.50rem 0;
  padding: 1rem;
  border: 1px solid var(--body);
  background-color: var(--main);
  border-radius: 1rem !important;
  font-size: 1.30rem;
}

a {
  text-decoration: none;
  color: var(--blue-color);
}
a:hover {
  color: var(--light-color);
}
a.goth {
  color: var(--dark-color);
}
a.goth:hover {
  color: var(--blue-color);
}
a.money {
  color: var(--lite-color);
}
a.money:hover {
  color: var(--money-bright);
}

hr {
  height: 2px;
  border: 0;
  background-color: var(--prime);
}

h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; }

input[type="submit"] {
  border: 1px solid var(--element-bdr);
  background-color: var(--element-bgc);
  color: var(--font-lite-color);
  border-radius: 0.20rem;
  padding: 0.20rem 0.25rem;
  cursor: pointer;
}

input[type="submit"]:hover {
  background-color: var(--element-hov);
}

p {
  line-height: 1.5;
}

header.main {
  padding: 1rem 0;
  background-color: var(--prime);
}

footer.main {
}

main.main {
  padding: 1rem 0;
  margin: 0;
  background-color: var(--main);
}

.screen-reader-text {
    border: 0;
    clip-path: inset(50%); /* Hides the element visually */
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute; /* Takes the element out of the normal flow */
    width: 1px;
    word-wrap: normal !important; /* Prevents long words from breaking the layout */
}

/* Styles for when a focusable element with .screen-reader-text receives keyboard focus */
.screen-reader-text:focus {
    background-color: #f1f1f1;
    border-radius: 3px;
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
    clip-path: none; /* Makes the element visible on focus */
    color: #21759b;
    display: block;
    font-size: 14px;
    font-weight: bold;
    height: auto;
    left: 5px;
    line-height: normal;
    padding: 15px 23px 14px;
    text-decoration: none;
    top: 5px;
    width: auto;
    z-index: 100000; /* Ensures the element is above other content */
}

/*
#toggle-nav {
  display: none;
  text-align: right;
  padding: 0.50rem 1rem;
  transition: color linear 0.15s;
  color: var(--font-lite-color);
  background: var(--main-color);
  font-size: 1.80rem;
}

#toggle-nav:hover {
  color: #CCC;
}

@media only screen and(max-width: 768px) {

  #toggle-nav {
    display: block;
  }
}
*/

.section {
  margin: 0 auto;
  max-width: 920px;
}

.section h2 {
  border-bottom: 1px solid var(--element-bdr);
  margin-bottom: 1.25rem;
  padding-bottom: 0.25rem;
  font-size: 1.80rem;
}
.section h6 {
  font-size: 1rem;
}

.medium {
  background-color: var(--body);
}

@media screen and (max-width: 940px) {
  .section {
    margin: 0 1rem;
  }
}

#widgets {
  background-color: var(--prime);
}
#widgets img.location {
  border-radius: 1rem;
}

#widgets div.icontext {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.25rem;
}


#widget-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(3, 1fr);
  padding: 1rem 0;
}

@media screen and (max-width: 640px) {
  #widget-grid {
    display: block;
  }

  #widget-grid > div {
    margin: 1rem auto;
    max-width: 200px;
  }
}

#copyright {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(2, 1fr);
  margin: 0;
  padding: 1rem 0;
  color: var(--base-color);
}
#copyright .cr-left {
  text-align: left;
}

#copyright .cr-right {
  text-align: right;
  font-weight: bold;
}

#branding {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 0.50rem 0.50rem;
  align-items: center;
  padding: 0.50rem;
}

#site-logo {
  justify-content: flex-start;
}

#site-title {
  flex: 1;
  justify-content: center;
  font-weight: bold;
}

#site-description {
  justify-content: flex-end;
  font-weight: bold;
  color: #FFF;
}

.head1 {
  font-size: 1.60rem;
  font-weight: bold;
  margin: 1rem 0;
}
.head2 {
  font-size: 1.40rem;
  font-weight: bold;
  margin: 1rem 0;
}

.company {
  font-size: 1.40rem;
  font-weight: bold;
  text-align: center;
  margin-bottom: 1.50rem;
}
.company > b {
  font-size: 1.60rem;
  color: var(--prime);
}

.mugshot > img {
  border-radius: 1rem;
}

.textbox {
  margin: 2rem 0;
  padding: 1rem;
  background-color: var(--base-color);
  border-radius: 0.75rem;
  box-shadow: var(--shadow);
  line-height: 1.5;
}

.bigtext {
  font-size: 1.30rem;
}

.textbox p {
  margin: 0;
}

.zontext p {
  margin: 0.25rem 0;
}

.button {
  display: inline-block;
  text-align: center;
  background: var(--body);
  color: var(--lite-color);
  border: 1px solid var(--dark-color);
  border-radius: 0.25rem;
  font-size: 1rem;
  padding: 0.25rem 0.50rem;
  margin: 0.25rem 0;
  cursor: pointer;
}

.button:hover {
  background: var(--main);
  color: var(--dark-color);
}

.csr-menu {

}

.csr-menu ul.menu {
  display: flex;
  gap: 1rem;
  align-items: center;

  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

.csr-menu ul.menu li > a {
  display: block;
  color: var(--base-color);
  font-weight: bold;
  padding: 0.25rem 0.50rem;
}

.csr-menu ul.menu li > a:hover {
  color: var(--dark-color);
}
.csr-menu ul.menu li.current-menu-item > a {
  color: var(--link-sel);
}

@media screen and (max-width: 400px) {
  .csr-menu ul.menu {
    display: block;
    border-top: 1px solid var(--lite-color);
  }
  .csr-menu ul.menu li > a {
    border-bottom: 1px solid var(--lite-color);

  }
}

header.article {
  margin-top: 0.50rem;
}
article {
  margin-top: 0.50rem;
}
footer.article {
  margin-top: 0.50rem;
}
footer.single {
  margin-top: 0.50rem;
}

.archive-meta {

}

.post {}
.author {}

.attachment {}
.attachment-full {}

.cat-links {}
.tag-links {}

.entry-attachment {}
.entry-caption {}
.entry-content {}
.entry-date {}
.entry-links {}
.entry-meta {}
.entry-summary {}
.entry-title {}

.nav-links { border-top: 1px solid #333; }
.meta-nav {}
.meta-sep {}
.navigation {}
.nav-next { display: inline-block; }
.nav-previous { display: inline-block; margin-right: 1rem; }

/* FIN */
