/*
 * BAS Theme CSS — copied from Brand Styling master
 * Source: C:\xampp\ht-bit_BusinessRules\Brand Styling\BAS-theme-CSS-handoff-preview.css
 * Do not edit here — edit the master and re-copy.
 */

/* ============================================================
   CSS CUSTOM PROPERTIES (Variables)
   ============================================================ */
:root {
  --bg-page:        #F5F5F5;
  --bg-white:       #FFFFFF;
  --bg-light:       #F0F0F0;
  --bg-subtle:      #E8E8E8;
  --bg-header:      #FFFFFF;
  --bg-sidebar:     #F7F7F7;
  --bg-footer:      #EEEEEE;
  --bg-card:        #FFFFFF;
  --bg-table-alt:   #FAFAFA;
  --bg-hover:       #FFF4E5;
  --bg-selected:    #FFF0D9;
  --bg-input:       #FFFFFF;
  --bg-disabled:    #F0F0F0;

  --border-strong:  #BBBBBB;
  --border-medium:  #D0D0D0;
  --border-light:   #E3E3E3;
  --border-input:   #C8C8C8;
  --border-focus:   #C45E00;

  --text-primary:   #1A1A1A;
  --text-secondary: #3D3D3D;
  --text-muted:     #717171;
  --text-disabled:  #AAAAAA;
  --text-white:     #FFFFFF;
  --text-heading:   #111111;

  --orange-light:   #ffebcc;
  --orange-mid:     #ffcc80;
  --orange-dark:    #C45E00;

  --link-default:   #C45E00;
  --link-hover:     #C45E00;
  --link-visited:   #9E4E00;
  --link-active:    #9E4E00;

  --btn-primary-bg:      #ff9900;
  --btn-primary-text:    #FFFFFF;
  --btn-primary-border:  #cc7a00;
  --btn-primary-hover:   #ffb833;
  --btn-secondary-bg:    #FFFFFF;
  --btn-secondary-text:  #C45E00;
  --btn-secondary-border:#C45E00;
  --btn-secondary-hover: #FFF4E5;

  --shadow-sm:  0 1px 3px rgba(0,0,0,0.08);
  --shadow-md:  0 3px 8px rgba(0,0,0,0.10);
  --shadow-lg:  0 6px 20px rgba(0,0,0,0.12);

  --radius-sm: 3px;
  --radius-md: 5px;
  --radius-lg: 8px;

  --font-body:    'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  --font-heading: 'Segoe UI Semibold', 'Segoe UI', Tahoma, sans-serif;
  --font-mono:    'Consolas', 'Courier New', monospace;
  --font-size-base: 14px;
  --line-height:  1.55;
}

/* ============================================================
   GLOBAL RESET / BASE
   ============================================================ */
body {
  font-family: var(--font-body);
  font-size: var(--font-size-base);
  line-height: var(--line-height);
  color: var(--text-primary);
  background-color: var(--bg-page);
  margin: 0;
  padding: 0;
}

*, *::before, *::after { box-sizing: border-box; }

/* ============================================================
   TYPOGRAPHY
   ============================================================ */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  color: var(--text-heading);
  font-weight: 600;
  margin-top: 0;
  line-height: 1.3;
}

h1 { font-size: 1.75rem; }
h2 { font-size: 1.45rem; }
h3 { font-size: 1.2rem; }
h4 { font-size: 1.05rem; }

p { color: var(--text-secondary); margin: 0 0 0.85em; }
small, .text-muted { color: var(--text-muted); font-size: 0.88em; }

/* ============================================================
   HYPERLINKS
   ============================================================ */
a, a:link  { color: var(--link-default); text-decoration: none; transition: color 0.15s ease; }
a:hover    { color: var(--link-hover); text-decoration: underline; }
a:visited  { color: var(--link-visited); }
a:active   { color: var(--link-active); }

/* ============================================================
   BUTTONS
   ============================================================ */
.btn {
  font-family: var(--font-body);
  font-size: 0.875rem;
  font-weight: 500;
  border-radius: var(--radius-sm);
  padding: 7px 16px;
  cursor: pointer;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
  line-height: 1.4;
  display: inline-block;
  text-decoration: none;
  border: 1px solid transparent;
}

.btn-primary {
  background-color: var(--btn-primary-bg);
  color: var(--btn-primary-text);
  border-color: var(--btn-primary-border);
}
.btn-primary:hover, .btn-primary:focus {
  background-color: var(--btn-primary-hover);
  color: var(--text-white);
  text-decoration: none;
}

.btn-secondary {
  background-color: var(--btn-secondary-bg);
  color: var(--btn-secondary-text);
  border-color: var(--btn-secondary-border);
}
.btn-secondary:hover {
  background-color: var(--btn-secondary-hover);
  color: var(--orange-dark);
  text-decoration: none;
}

.btn-lg  { padding: 12px 28px; font-size: 1rem; }
.btn-sm  { padding: 4px 10px;  font-size: 0.8rem; }

/* ============================================================
   FORMS
   ============================================================ */
label { color: var(--text-secondary); font-weight: 500; font-size: 0.875rem; margin-bottom: 4px; display: block; }

input[type="text"],
input[type="email"],
input[type="tel"],
textarea,
select {
  background-color: var(--bg-input);
  border: 1px solid var(--border-input);
  border-radius: var(--radius-sm);
  color: var(--text-primary);
  font-family: var(--font-body);
  font-size: 0.875rem;
  padding: 9px 12px;
  width: 100%;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
  line-height: 1.4;
}

input:focus, textarea:focus, select:focus {
  border-color: var(--border-focus);
  outline: none;
  box-shadow: 0 0 0 3px rgba(196,94,0,0.12);
}

/* ============================================================
   ALERTS
   ============================================================ */
.alert {
  border-radius: var(--radius-md);
  padding: 12px 16px;
  font-size: 0.875rem;
  border: 1px solid transparent;
  margin-bottom: 16px;
}
.alert-success { background-color: #F0FAF0; border-color: #A3D9A3; color: #2E6B2E; }
.alert-warning { background-color: #FFF8EC; border-color: var(--orange-light); color: #7A4500; }
.alert-danger  { background-color: #FFF0F0; border-color: #F5A3A3; color: #8B1A1A; }
.alert-info    { background-color: #F0F6FF; border-color: #A3BEF5; color: #1A3A7A; }

/* ============================================================
   UTILITY
   ============================================================ */
.text-orange  { color: var(--orange-dark) !important; }
.text-muted   { color: var(--text-muted) !important; }
.divider      { border-top: 1px solid var(--border-light); margin: 16px 0; }
.shadow-sm    { box-shadow: var(--shadow-sm); }
.shadow-md    { box-shadow: var(--shadow-md); }

/* ============================================================
   PRINT
   ============================================================ */
@media print {
  body { background: white; color: black; }
  a    { color: #C45E00; text-decoration: underline; }
  .site-nav, .site-footer .footer-bottom, .btn { display: none !important; }
}
