/* ==========================================================================
   Blesta Bootstrap Theme — Modern Corporate Edition (Oracle Redwood Palette)
   All "theme_*" tokens are replaced at runtime by Blesta.
   Palette: Oracle Redwood Design System
   ========================================================================== */

/* ── Google Fonts ─────────────────────────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

/* ── Oracle Redwood Design Tokens ─────────────────────────────────────────── */
:root {
  /* Neutrals */
  --rw-neutral-10:  #fff;
  --rw-neutral-20:  #fbf9f8;
  --rw-neutral-30:  #f5f4f2;
  --rw-neutral-40:  #f1efed;
  --rw-neutral-50:  #ebeae7;
  --rw-neutral-60:  #e4e1dd;
  --rw-neutral-80:  #d8d4cf;
  --rw-neutral-100: #c6c1bd;
  --rw-neutral-110: #aea8a2;
  --rw-neutral-120: #8b8580;
  --rw-neutral-130: #7a736e;
  --rw-neutral-140: #665f5b;
  --rw-neutral-150: #514c47;
  --rw-neutral-160: #3a3632;
  --rw-neutral-170: #312d2a;
  --rw-neutral-180: #211e1c;

  /* Reds / brand */
  --rw-red-60:  #ca4d3c;
  --rw-red-70:  #c74634;
  --rw-red-80:  #bd4332;
  --rw-red-90:  #ac3e2e;
  --rw-red-100: #9b382a;

  /* Blue */
  --rw-blue-40: #558ea4;
  --rw-blue-50: #437c94;
  --rw-blue-60: #3b7087;
  --rw-blue-80: #325c72;

  /* Teal */
  --rw-teal-50: #628f8d;
  --rw-teal-60: #4f7d7b;

  /* Green */
  --rw-green-60: #6f915d;
  --rw-green-70: #5f7d4f;

  /* Orange */
  --rw-orange-40: #deb068;
  --rw-orange-50: #d39f5d;

  /* Yellow */
  --rw-yellow-30: #f7e0a1;
  --rw-yellow-40: #f0cc71;

  /* Beige */
  --rw-beige-10: #f1efed;
  --rw-beige-20: #e4e1dd;

  /* Slate */
  --rw-slate-10: #e7f2f2;
  --rw-slate-20: #d7e5e5;

  /* Spacing & shape */
  --radius-sm:  4px;
  --radius:     8px;
  --radius-lg: 12px;
  --shadow-sm:  0 1px 3px rgba(0,0,0,.07), 0 1px 2px rgba(0,0,0,.04);
  --shadow:     0 4px 12px rgba(0,0,0,.09), 0 2px 4px rgba(0,0,0,.05);
  --shadow-lg:  0 10px 28px rgba(0,0,0,.11), 0 4px 10px rgba(0,0,0,.06);
  --transition: 0.18s ease;
  --font-main:  'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

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

body {
  font-family: var(--font-main);
  font-size: 0.9375rem;
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: -0.01em;
  color: var(--rw-neutral-170);
  background-color: #ffffff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ── Links ────────────────────────────────────────────────────────────────── */
a, a:hover {
  color: #0074b2;
  text-decoration: none;
  transition: color var(--transition), opacity var(--transition);
}
a:hover { opacity: 0.82; }

/* ── Header ───────────────────────────────────────────────────────────────── */
.header {
  background: #ffffff;
  border-bottom: 1px solid var(--rw-neutral-60);
  padding: 0;
  position: relative;
  z-index: 100;
}

.header .container-md {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 0.875rem;
  padding-bottom: 0.875rem;
}

.header .logo a {
  display: inline-flex;
  align-items: center;
}

.header .logo img {
  max-height: 40px;
  width: auto;
  transition: opacity var(--transition);
}
.header .logo img:hover { opacity: 0.85; }

/* ── Top nav (language / user badge) ─────────────────────────────────────── */
.top-nav .dropdown a.dropdown-toggle,
.top-nav .dropdown a.dropdown-toggle:focus {
  color: #ebebeb !important;
  font-size: 0.875rem;
  font-weight: 500;
  padding: 0.35rem 0.75rem;
  border-radius: var(--radius-sm);
  transition: background var(--transition), color var(--transition);
}
.top-nav .dropdown a.dropdown-toggle:hover {
  color: #ffffff !important;
  background: rgba(255,255,255,0.12);
}

/* ── Navigation bar ───────────────────────────────────────────────────────── */
.nav-content {
  border-bottom: 1px solid var(--rw-neutral-60);
}

.nav-content nav.navbar {
  background: #2e3338;
  padding: 0;
  min-height: 48px;
}

.nav-content nav.navbar .container-md {
  padding-top: 0;
  padding-bottom: 0;
}

/* Nav links */
.nav-content nav.navbar .navbar-nav > li > a,
.nav-content nav.navbar .navbar-nav .nav-link {
  color: #d8dbde !important;
  font-weight: 500;
  font-size: 0.875rem;
  letter-spacing: 0.01em;
  padding: 0.85rem 1rem;
  position: relative;
  transition: color var(--transition);
}

/* Active / hover — Redwood terracotta underline accent */
.nav-content nav.navbar .navbar-nav > li > a::after,
.nav-content nav.navbar .navbar-nav .nav-link::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 1rem;
  right: 1rem;
  height: 3px;
  background: var(--rw-red-70);   /* Redwood accent */
  opacity: 0;
  transition: opacity var(--transition);
  border-radius: 3px 3px 0 0;
}

.nav-content nav.navbar .navbar-nav > li > a:hover::after,
.nav-content nav.navbar .navbar-nav .nav-link:hover::after,
.nav-content nav.navbar .navbar-nav > .active > a::after,
.nav-content nav.navbar .navbar-nav .nav-link.active::after {
  opacity: 1;
}

.nav-content nav.navbar .navbar-nav > .active > a,
nav.navbar .navbar-nav > .active > a:hover,
nav.navbar .navbar-nav > .active > a:focus,
.nav-content nav.navbar .navbar-nav > li > a:hover,
.nav-content nav.navbar .navbar-nav > .open > a,
nav.navbar .navbar-nav > .open > a:hover,
nav.navbar .navbar-nav > .open > a:focus {
  color: #fbfcfd !important;
}

@media (max-width: 767px) {
  .nav-content nav.navbar .navbar-nav > li > a::after { display: none; }
  nav.navbar .navbar-nav .show .dropdown-menu > a {
    color: #d8dbde !important;
  }
  nav.navbar .navbar-nav .show .dropdown-menu > a:hover,
  nav.navbar .navbar-nav .show .dropdown-menu > a:focus {
    color: #fbfcfd !important;
  }
}

/* Dropdown menus */
.nav-content .dropdown-menu {
  border: 1px solid var(--rw-neutral-60);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 0.4rem;
  min-width: 200px;
  margin-top: 2px;
  background: var(--rw-neutral-10);
}

.nav-content .dropdown-item {
  border-radius: var(--radius-sm);
  padding: 0.5rem 0.875rem;
  font-size: 0.875rem;
  font-weight: 400;
  color: var(--rw-neutral-160);
  transition: background var(--transition);
}

.nav-content .dropdown-item:hover,
.nav-content .dropdown-item:focus {
  background: var(--rw-neutral-40);
  color: var(--rw-neutral-170);
}

.nav-content .dropdown-divider {
  margin: 0.3rem 0;
  border-color: var(--rw-neutral-60);
}

/* ── Page title strip ─────────────────────────────────────────────────────── */
.title {
  background: #f7f9fb;
  padding: 1rem 0;
  border-bottom: 1px solid var(--rw-neutral-60);
}

.title h3 {
  color: #232629;
  font-size: 1.1rem;
  font-weight: 600;
  letter-spacing: -0.02em;
  margin: 0;
  line-height: 1.3;
}

/* ── Cards ────────────────────────────────────────────────────────────────── */
.card-blesta {
  border: 1px solid var(--rw-neutral-60) !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--shadow-sm);
  background: var(--rw-neutral-10);
  overflow: hidden;
  transition: box-shadow var(--transition);
}

.card-blesta:hover {
  box-shadow: var(--shadow);
}

.card-blesta > .card-header {
  color: #f2f2f2;
  background: #2e3338;
  border-bottom: 1px solid var(--rw-neutral-60);
  padding: 0.875rem 1.25rem;
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: -0.01em;
}

/* ── Panel (legacy) ───────────────────────────────────────────────────────── */
.panel-blesta {
  border-radius: var(--radius-lg) !important;
  border: 1px solid var(--rw-neutral-60) !important;
  box-shadow: var(--shadow-sm);
  overflow: hidden;
}

/* ── List group (sidebar nav) ─────────────────────────────────────────────── */
.list-group {
  border-radius: var(--radius);
  overflow: hidden;
}

.list-group-item {
  border-color: var(--rw-neutral-60);
  padding: 0.7rem 1rem;
  font-size: 0.875rem;
  background: var(--rw-neutral-10);
  transition: background var(--transition);
}

.list-group.list-options a.list-group-item:hover,
.list-group.list-options a.list-group-item:focus,
a.list-group-item:hover,
a.list-group-item:focus {
  background-color: #d1ecf1 !important;
}

a.list-group-item.active,
a.list-group-item.active:hover,
a.list-group-item.active:focus {
  background-color: #d1ecf1 !important;
}

.list-group-item h4 {
  color: #0074b2 !important;
  font-size: 0.875rem;
  font-weight: 600;
}

/* ── Tables ───────────────────────────────────────────────────────────────── */
.table {
  font-size: 0.875rem;
}

.table thead th {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--rw-neutral-130);
  border-bottom: 2px solid var(--rw-neutral-60);
  background: var(--rw-neutral-30);
  padding-top: 0.65rem;
  padding-bottom: 0.65rem;
}

.table td {
  vertical-align: middle;
  border-color: var(--rw-neutral-50);
  color: var(--rw-neutral-160);
}

.table-hover > tbody > tr:hover > td,
.table-hover > tbody > tr:hover > th {
  background-color: #d1ecf1 !important;
}

/* ── Forms ────────────────────────────────────────────────────────────────── */
.form-control {
  border-radius: var(--radius-sm);
  border: 1px solid var(--rw-neutral-100);
  background: var(--rw-neutral-10);
  font-size: 0.9rem;
  padding: 0.5rem 0.75rem;
  color: var(--rw-neutral-170);
  transition: border-color var(--transition), box-shadow var(--transition);
}

.form-control:focus {
  border-color: var(--rw-blue-50);
  box-shadow: 0 0 0 3px rgba(67,124,148,0.15);
  outline: none;
  background: var(--rw-neutral-10);
}

.form-control::placeholder { color: var(--rw-neutral-110); }

label {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--rw-neutral-150);
  margin-bottom: 0.35rem;
}

/* ── Buttons — Primary (Redwood red-80) ───────────────────────────────────── */
.btn {
  font-family: var(--font-main);
  font-weight: 500;
  font-size: 0.875rem;
  letter-spacing: 0.01em;
  border-radius: var(--radius-sm);
  padding: 0.475rem 1.1rem;
  cursor: pointer;
  transition: background var(--transition), border-color var(--transition),
              box-shadow var(--transition), opacity var(--transition);
}

.btn-primary {
  color: #ffffff !important;
  background-color: #007bff !important;
  border-color: #007bff !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.18);
}
.btn-primary:hover {
  color: #ffffff !important;
  background-color: #0069d9 !important;
  border-color: #0069d9 !important;
  box-shadow: 0 3px 8px rgba(0,0,0,0.18);
}
.btn-primary:disabled,
.btn-primary.disabled {
  background-color: #007bff !important;
  opacity: 0.5;
}
.btn-outline-primary {
  color: #007bff;
  border-color: #007bff !important;
}
.btn-outline-primary:hover {
  color: #ffffff;
  background: #007bff;
}

/* Secondary */
.btn-secondary {
  color: #ffffff !important;
  background-color: #6c757d !important;
  border-color: #6c757d !important;
}
.btn-secondary:hover {
  color: #ffffff !important;
  background-color: #545b62 !important;
  border-color: #545b62 !important;
}
.btn-secondary:disabled,
.btn-secondary.disabled {
  background-color: #6c757d !important;
  opacity: 0.5;
}
.btn-outline-secondary {
  color: #6c757d;
  border-color: #6c757d !important;
}
.btn-outline-secondary:hover {
  color: #ffffff;
  background: #6c757d;
}

/* Success */
.btn-success {
  color: #ffffff !important;
  background-color: #28a746 !important;
  border-color: #28a746 !important;
}
.btn-success:hover {
  color: #ffffff !important;
  background-color: #218838 !important;
  border-color: #218838 !important;
}
.btn-success:disabled,
.btn-success.disabled {
  background-color: #28a746 !important;
  opacity: 0.5;
}
.btn-outline-success {
  color: #28a746;
  border-color: #28a746 !important;
}
.btn-outline-success:hover {
  color: #ffffff;
  background: #28a746;
}

/* Info */
.btn-info {
  color: #ffffff !important;
  background-color: #17a3b8 !important;
  border-color: #17a3b8 !important;
}
.btn-info:hover {
  color: #ffffff !important;
  background-color: #138596 !important;
  border-color: #138596 !important;
}
.btn-info:disabled,
.btn-info.disabled {
  background-color: #17a3b8 !important;
  opacity: 0.5;
}
.btn-outline-info {
  color: #17a3b8;
  border-color: #17a3b8 !important;
}
.btn-outline-info:hover {
  color: #ffffff;
  background: #17a3b8;
}

/* Warning */
.btn-warning {
  color: #ffffff !important;
  background-color: #ffc107 !important;
  border-color: #ffc107 !important;
}
.btn-warning:hover {
  color: #ffffff !important;
  background-color: #e0a800 !important;
  border-color: #e0a800 !important;
}
.btn-warning:disabled,
.btn-warning.disabled {
  background-color: #ffc107 !important;
  opacity: 0.5;
}
.btn-outline-warning {
  color: #ffc107;
  border-color: #ffc107 !important;
}
.btn-outline-warning:hover {
  color: #ffffff;
  background: #ffc107;
}

/* Danger */
.btn-danger {
  color: #ffffff !important;
  background-color: #dc3545 !important;
  border-color: #dc3545 !important;
}
.btn-danger:hover {
  color: #ffffff !important;
  background-color: #c82334 !important;
  border-color: #c82334 !important;
}
.btn-danger:disabled,
.btn-danger.disabled {
  background-color: #dc3545 !important;
  opacity: 0.5;
}
.btn-outline-danger {
  color: #dc3545;
  border-color: #dc3545 !important;
}
.btn-outline-danger:hover {
  color: #ffffff;
  background: #dc3545;
}

/* Light */
.btn-light {
  color: #212529 !important;
  background-color: #ffffff !important;
  border-color: #e2e6ea !important;
}
.btn-light:hover {
  color: #212529 !important;
  background-color: #e2e6ea !important;
  border-color: #e2e6ea !important;
}
.btn-light:disabled,
.btn-light.disabled {
  background-color: #ffffff !important;
  opacity: 0.5;
}
.btn-outline-light {
  color: #ffffff;
  border-color: #ffffff !important;
}
.btn-outline-light:hover {
  color: #212529;
  background: #ffffff;
}

/* ── Alerts — Redwood-coloured accent borders ─────────────────────────────── */
.alert {
  border-radius: var(--radius);
  font-size: 0.875rem;
  border-width: 1px;
  border-left-width: 4px;
}

.alert-primary {
  color: #004085;
  background: #cce5ff;
  border-color: #b8daff;
}
.alert-secondary {
  color: #383d41;
  background: #e2e3e5;
  border-color: #d6d8db;
}
.alert-success {
  color: #155725;
  background: #d4edda;
  border-color: #c3e6cb;
}
.alert-info {
  color: #0c5360;
  background: #d1ecf1;
  border-color: #bee5eb;
}
.alert-warning {
  color: #856504;
  background: #fff3cd;
  border-color: #ffeeba;
}
.alert-danger {
  color: #721c25;
  background: #f8d7da;
  border-color: #f5c6cb;
}
.alert-light {
  color: #818182;
  background: #fefefe;
  border-color: #fdfdfe;
}

/* ── Badges ───────────────────────────────────────────────────────────────── */
.badge,
.label {
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  border-radius: var(--radius-sm);
  padding: 0.25em 0.55em;
}

.badge-primary, .label.label-primary {
  color: #ffffff !important;
  background-color: #007bff !important;
}
.badge-secondary {
  color: #ffffff !important;
  background-color: #6c757d !important;
}
.badge-success, .label.label-success {
  color: #ffffff !important;
  background-color: #28a746 !important;
}
.badge-info {
  color: #ffffff !important;
  background-color: #17a3b8 !important;
}
.badge-warning, .label.label-warning {
  color: #ffffff !important;
  background-color: #ffc107 !important;
}
.badge-danger, .label.label-danger {
  color: #ffffff !important;
  background-color: #dc3545 !important;
}

/* ── Bootstrap utility overrides ──────────────────────────────────────────── */
.bg-primary    { background-color: #007bff !important; }
.text-primary  { color:            #007bff !important; }
.border-primary{ border-color:     #007bff !important; }

.bg-secondary    { background-color: #6c757d !important; }
.text-secondary  { color:            #6c757d !important; }
.border-secondary{ border-color:     #6c757d !important; }

.bg-success    { background-color: #28a746 !important; }
.text-success  { color:            #28a746 !important; }
.border-success{ border-color:     #28a746 !important; }

.bg-info    { background-color: #17a3b8 !important; }
.text-info  { color:            #17a3b8 !important; }
.border-info{ border-color:     #17a3b8 !important; }

.bg-warning    { background-color: #ffc107 !important; }
.text-warning  { color:            #ffc107 !important; }
.border-warning{ border-color:     #ffc107 !important; }

.bg-danger    { background-color: #dc3545 !important; }
.text-danger  { color:            #dc3545 !important; }
.border-danger{ border-color:     #dc3545 !important; }

.bg-light    { background-color: #ffffff !important; }
.text-light  { color:            #ffffff !important; }
.border-light{ border-color:     #ffffff !important; }

/* ── Pagination ───────────────────────────────────────────────────────────── */
.pagination .page-item.active .page-link,
div.pagination ul.pagination li.active .page-link,
div.pagination ul.pagination li.active a {
  background-color: #0074b2;
  border-color: #0074b2;
  color: #fff;
  border-radius: var(--radius-sm);
}

.page-link,
div.pagination ul.pagination li a {
  border-radius: var(--radius-sm);
  font-size: 0.875rem;
  font-weight: 500;
  color: #0074b2;
  border: 1px solid var(--rw-neutral-80);
  background: var(--rw-neutral-10);
  transition: background var(--transition), border-color var(--transition);
}

.page-link:hover,
div.pagination ul.pagination li a:hover {
  background: var(--rw-neutral-40);
  border-color: var(--rw-neutral-100);
}

/* ── Top focus box ────────────────────────────────────────────────────────── */
.top-focus-box {
  background-color: #d1ecf1 !important;
  border-radius: var(--radius);
  border: 1px solid var(--rw-neutral-60);
  padding: 0.875rem 1.25rem;
  font-size: 0.875rem;
}

/* ── Settings link ────────────────────────────────────────────────────────── */
.list-group-item.credits {
  color: #4f4f4f !important;
  font-size: 0.875rem;
}

/* ── Login page centering ─────────────────────────────────────────────────── */
.row.login {
  min-height: 70vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ── Footer ───────────────────────────────────────────────────────────────── */
.footer { margin-top: 3rem; padding-top: 0.5rem; }
.footer hr {
  border-color: var(--rw-neutral-60);
  margin-bottom: 1rem;
}
.footer p {
  font-size: 0.8rem;
  color: var(--rw-neutral-120);
  margin: 0;
}

/* ── Modal ────────────────────────────────────────────────────────────────── */
.modal-content {
  border: 1px solid var(--rw-neutral-60);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
}
.modal-header {
  border-bottom: 1px solid var(--rw-neutral-50);
  background: var(--rw-neutral-30);
  padding: 1.125rem 1.5rem;
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
}
.modal-header .modal-title {
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--rw-neutral-170);
}
.modal-body   { padding: 1.25rem 1.5rem; }
.modal-footer {
  border-top: 1px solid var(--rw-neutral-50);
  background: var(--rw-neutral-20);
  padding: 0.875rem 1.5rem;
  border-radius: 0 0 var(--radius-lg) var(--radius-lg);
}

/* ── Well ─────────────────────────────────────────────────────────────────── */
.well {
  background-color: var(--rw-neutral-30) !important;
  border: 1px solid var(--rw-neutral-60) !important;
  border-radius: var(--radius) !important;
  padding: 1rem !important;
}

/* ── Breadcrumb ───────────────────────────────────────────────────────────── */
.breadcrumb {
  background: transparent;
  padding: 0.5rem 0;
  font-size: 0.8rem;
  color: var(--rw-neutral-120);
}
.breadcrumb-item + .breadcrumb-item::before { color: var(--rw-neutral-100); }
.breadcrumb-item.active { color: var(--rw-neutral-110); }

/* ── Headings ─────────────────────────────────────────────────────────────── */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-main);
  font-weight: 600;
  letter-spacing: -0.02em;
  color: var(--rw-neutral-180);
  line-height: 1.3;
}

/* ── Redwood semantic surface helpers (opt-in) ────────────────────────────── */
.rw-surface      { background: var(--rw-neutral-20); }
.rw-surface-warm { background: var(--rw-beige-10); }
.rw-surface-cool { background: var(--rw-slate-10); }
.rw-divider      { border-color: var(--rw-neutral-60) !important; }
.rw-tag-red      { background: #fcd0ca; color: var(--rw-red-100); border-radius: var(--radius-sm); padding: 0.2em 0.55em; font-size: 0.75rem; font-weight: 600; }
.rw-tag-blue     { background: #d0e5ed; color: var(--rw-blue-80); border-radius: var(--radius-sm); padding: 0.2em 0.55em; font-size: 0.75rem; font-weight: 600; }
.rw-tag-green    { background: #e5f4dc; color: var(--rw-green-70); border-radius: var(--radius-sm); padding: 0.2em 0.55em; font-size: 0.75rem; font-weight: 600; }
.rw-tag-teal     { background: #d6e5e5; color: var(--rw-teal-60); border-radius: var(--radius-sm); padding: 0.2em 0.55em; font-size: 0.75rem; font-weight: 600; }
.rw-tag-orange   { background: #fcedd9; color: var(--rw-orange-50); border-radius: var(--radius-sm); padding: 0.2em 0.55em; font-size: 0.75rem; font-weight: 600; }

/* ── Responsive ───────────────────────────────────────────────────────────── */
@media (max-width: 767px) {
  .header .logo img { max-height: 32px; }
  .title h3 { font-size: 1rem; }
  .card-blesta { border-radius: var(--radius) !important; }
}

/* ── Reduced motion ───────────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    transition-duration: 0.01ms !important;
    animation-duration:  0.01ms !important;
  }
}
