/* Identidade do painel: superfícies claras, grafite e dourado discreto.
 * O logotipo original é preservado; estados mantêm suas cores semânticas. */

@font-face {
  font-family: "Open Sans Rommanel";
  src: url("../fonts/open-sans-regular.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Open Sans Rommanel";
  src: url("../fonts/open-sans-medium.ttf") format("truetype");
  font-style: normal;
  font-weight: 500 600;
  font-display: swap;
}

@font-face {
  font-family: "Open Sans Rommanel";
  src: url("../fonts/open-sans-bold.ttf") format("truetype");
  font-style: normal;
  font-weight: 700 950;
  font-display: swap;
}

:root {
  --brand-logo: #522c47;
  --ops-radius-sm: 5px;
  --ops-radius-md: 7px;
  --ops-radius-lg: 8px;
  --brand-950: #252a30;
  --brand-900: #343a40;
  --brand-800: #4b463b;
  --brand-700: #806124;
  --brand-600: #806124;
  --brand-500: #a88645;
  --brand-400: #bda36b;
  --brand-300: #d4c49f;
  --brand-200: #e3e5e8;
  --brand-100: #f5efdf;
  --brand-50: #f5f6f8;
  --brand-canvas: #f5f6f8;
  --brand-surface-soft: #fafbfc;
  --brand-border: #e3e5e8;
  --brand-border-strong: #c8cdd3;
  --brand-text: #252a30;
  --brand-text-soft: #515b66;
  /* Derivação acessível do cinza oficial #777: 5.27:1 sobre o canvas. */
  --brand-muted: #646e79;
  --brand-focus: 0 0 0 4px rgba(128, 97, 36, .20);

  --bs-primary: var(--brand-700);
  --bs-primary-rgb: 128, 97, 36;
  --bs-link-color: var(--brand-700);
  --bs-link-hover-color: var(--brand-900);

  /* Compatibilidade ainda usada pelas folhas administrativas existentes. */
  --ibg-900: var(--brand-900);
  --ibg-800: var(--brand-800);
  --ibg-700: var(--brand-700);
  --ibg-600: var(--brand-600);
  --ibg-500: var(--brand-500);
  --ibg-400: var(--brand-400);
  --ibg-100: var(--brand-100);

  --bg: var(--brand-canvas);
  --surface-2: var(--brand-surface-soft);
  --border: var(--brand-border);
  --text-primary: var(--brand-text);
  --text-secondary: var(--brand-text-soft);
  --text-muted: var(--brand-muted);
  --info: var(--brand-700);
  --info-bg: var(--brand-100);
  --ring: var(--brand-focus);

  --ops-font-sans: "Open Sans Rommanel", "Open Sans", Arial, sans-serif;
  --ops-canvas: var(--brand-canvas);
  --ops-surface-subtle: var(--brand-surface-soft);
  --ops-surface-muted: var(--brand-100);
  --ops-border: var(--brand-border);
  --ops-border-strong: var(--brand-border-strong);
  --ops-text: var(--brand-text);
  --ops-text-soft: var(--brand-text-soft);
  --ops-text-muted: var(--brand-muted);
  --ops-brand-950: var(--brand-950);
  --ops-brand-900: var(--brand-900);
  --ops-brand-800: var(--brand-800);
  --ops-accent: var(--brand-700);
  --ops-accent-hover: var(--brand-900);
  --ops-accent-soft: var(--brand-100);
  --ops-accent-border: var(--brand-300);
  --ops-info: var(--brand-700);
  --ops-info-soft: var(--brand-50);
  --ops-info-border: var(--brand-300);
  --ops-focus: 0 0 0 3px rgba(128, 97, 36, .22);
}

html,
body,
button,
input,
select,
textarea {
  font-family: "Open Sans Rommanel", "Open Sans", Arial, sans-serif;
}

body,
body.admin-body {
  color: var(--brand-text);
  background: var(--brand-canvas);
}

::selection {
  color: #fff;
  background: var(--brand-700);
}

input[type="checkbox"],
input[type="radio"] {
  accent-color: var(--brand-700);
}

.text-primary {
  color: var(--brand-700) !important;
}

:where(a, button, input, select, textarea, summary):focus-visible,
.admin-login-body :where(a, button, input):focus-visible {
  outline: 0;
  box-shadow: var(--brand-focus) !important;
}

.admin-sidebar {
  background:
    radial-gradient(circle at 20% 0%, rgba(191, 158, 186, .20), transparent 17rem),
    linear-gradient(180deg, var(--brand-950) 0%, var(--brand-900) 58%, #24121f 100%);
  border-right-color: rgba(255, 255, 255, .10);
  box-shadow: 18px 0 44px rgba(44, 23, 40, .20);
}

.admin-sidebar::before {
  background: radial-gradient(ellipse at 30% 0%, rgba(191, 158, 186, .24), transparent 70%);
}

.admin-brand-mark--rommanel {
  width: 74px !important;
  height: 48px !important;
  flex: 0 0 74px;
  padding: 7px !important;
  border: 1px solid rgba(255, 255, 255, .30) !important;
  border-radius: 13px !important;
  background: rgba(255, 255, 255, .96) !important;
  box-shadow: 0 12px 28px rgba(24, 10, 20, .26) !important;
}

.admin-brand-mark--rommanel img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.admin-brand-sub {
  color: rgba(255, 255, 255, .62) !important;
  letter-spacing: .02em;
}

.admin-nav a.active {
  color: #fff;
  border-color: rgba(228, 213, 225, .25);
  background: linear-gradient(135deg, rgba(191, 158, 186, .30), rgba(128, 97, 36, .28));
}

.admin-topbar {
  border-bottom-color: rgba(227, 217, 224, .90);
  background: rgba(255, 255, 255, .90);
}

.ops-eyebrow,
.ops-panel-kicker,
.admin-login-kicker {
  color: var(--brand-700) !important;
}

.btn-admin,
.admin-login-body .btn-admin {
  color: #fff;
  border-color: rgba(255, 255, 255, .14);
  background: var(--brand-700);
  box-shadow: 0 1px 2px rgba(37, 42, 48, .08);
}

.btn-admin:hover,
.admin-login-body .btn-admin:hover {
  color: #fff;
  background: #684e1d;
  box-shadow: 0 2px 4px rgba(37, 42, 48, .12);
}

.btn-admin-secondary {
  color: var(--brand-800);
  border-color: var(--brand-border-strong);
}

.btn-admin-secondary:hover {
  color: var(--brand-950);
  border-color: var(--brand-400);
  background: var(--brand-50);
}

.form-control:focus,
.form-select:focus,
.input-shell:focus-within,
.admin-login-body .input-shell:focus-within {
  border-color: var(--brand-700) !important;
  box-shadow: var(--brand-focus) !important;
}

.section-icon {
  color: var(--brand-700);
  border-color: var(--brand-200);
  background: var(--brand-100);
}

.admin-card.hoverable:hover,
.ops-panel:hover,
.user-form-card:hover {
  border-color: var(--brand-300);
}

.ops-table thead th {
  color: #515b66;
  background: var(--brand-50);
}

body.admin-body {
  --admin-blue: var(--brand-700);
  --admin-blue-2: var(--brand-900);
  --admin-navy: var(--brand-950);
  --admin-bg: var(--brand-canvas);
  --admin-soft: var(--brand-surface-soft);
  --admin-border: var(--brand-border);
  --admin-text: var(--brand-text);
  --admin-muted: var(--brand-muted);
}

.admin-avatar {
  background: var(--brand-700);
}

body.admin-login-body {
  background:
    radial-gradient(circle at 16% 14%, rgba(191, 158, 186, .20), transparent 25rem),
    linear-gradient(145deg, var(--brand-950), var(--brand-900));
}

.admin-login-card,
.premium-login-card {
  border-color: rgba(255, 255, 255, .30);
  border-radius: 22px;
  box-shadow: 0 24px 68px rgba(36, 18, 31, .34);
}

.admin-login-logo--rommanel {
  width: 180px !important;
  height: 64px !important;
  padding: 7px 10px;
  border: 1px solid var(--brand-border) !important;
  border-radius: 15px !important;
  background: #fff !important;
}

.admin-login-logo--rommanel img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.admin-security-note {
  color: var(--brand-800);
  border-color: var(--brand-200);
  background: var(--brand-50);
}

.area-chip input:checked + .area-chip-body {
  border-color: var(--brand-700);
  background: var(--brand-700);
}

.admin-nav-section-label {
  color: rgba(255, 255, 255, .72) !important;
}

.admin-nav a {
  color: rgba(255, 255, 255, .78);
}

.user-form-hero {
  border-color: var(--brand-border);
  background: linear-gradient(180deg, #fff, var(--brand-surface-soft));
}

.alert-info {
  color: var(--brand-800);
  border-color: var(--brand-300);
  background: var(--brand-100);
}

.area-chip-body i {
  color: var(--brand-700);
  border-color: var(--brand-200);
  background: var(--brand-100);
}

.area-chip:hover .area-chip-body {
  border-color: var(--brand-300);
}

.area-chip input:checked + .area-chip-body small {
  opacity: .94;
}

.input-shell:focus-within {
  background: var(--brand-surface-soft);
}

@media (max-width: 640px) {
  .admin-brand-mark--rommanel {
    width: 68px !important;
    flex-basis: 68px;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* Lateral roxa Rommanel, com superfícies claras no conteúdo. */
body.admin-body .admin-sidebar {
  background: #4b3048;
  color: #fff;
  border-right: 1px solid #432940;
  box-shadow: none;
}
.admin-sidebar .admin-sidebar-brand,
.admin-sidebar .admin-sidebar-footer {border-color: rgba(255,255,255,.14);}
.admin-sidebar .admin-brand-name,
.admin-sidebar .admin-user-meta {color: #fff;}
.admin-sidebar .admin-brand-sub {color: #ded2dc !important;}
.admin-sidebar .admin-brand-mark--rommanel {
  background: #fff !important;
  border-color: transparent !important;
  box-shadow: none !important;
}
.admin-sidebar .admin-nav-section-label {color: #d4c3d1 !important;}
.admin-sidebar .admin-nav {scrollbar-color: #91748a transparent;}
.admin-sidebar .admin-nav a {color: #eee5ec;font-weight: 500;}
.admin-sidebar .admin-nav a:hover {color: #fff;background: #5b3d57;}
.admin-sidebar .admin-nav a.active,
.admin-sidebar .admin-nav a[aria-current="page"] {
  color: #fff;
  background: #694762;
  border-color: #8b6b84;
  font-weight: 700;
}
.admin-sidebar .admin-nav a.active::before,
.admin-sidebar .admin-nav a[aria-current="page"]::before {background: #d9bdd2;}
.admin-sidebar .admin-user-card {background: #553750;border-color: rgba(255,255,255,.14);}
.admin-sidebar .admin-user-meta span {color: #ded2dc;}
.admin-sidebar .admin-avatar {background: #76536e;color: #fff;}
.admin-sidebar .admin-sidebar-footer .btn-admin-secondary {
  color: #eee5ec;border-color: #8b6b84;background: transparent;
}
.admin-sidebar .admin-sidebar-footer .btn-admin-secondary:hover {background: #5b3d57;color: #fff;}
.admin-sidebar :where(a, button):focus-visible {outline: 2px solid #e4cfde;outline-offset: 2px;}
.admin-topbar {background: #fff;border-color: var(--brand-border);box-shadow: none;}
.btn-admin-secondary {color: var(--brand-text-soft);border-color: var(--brand-border-strong);}
.ops-panel, .at-panel, .at-metrics article {box-shadow: 0 1px 2px rgba(37,42,48,.025);}
.ops-eyebrow, .ops-panel-kicker {color: var(--brand-muted) !important;}
.ops-page-eyebrow {color: var(--brand-muted);}
.ops-table thead th {background: var(--brand-surface-soft);}
.ops-table tbody tr:hover, .admin-table tbody tr:hover {background: var(--brand-surface-soft);}
.admin-body .form-check-input:checked {background-color: var(--brand-700);border-color: var(--brand-700);}
.admin-body .ops-panel-icon {background: var(--brand-50);color: var(--brand-muted);border-color: var(--brand-border);}
body.admin-login-body {background: #f5f6f8;}
.admin-login-card, .premium-login-card {border-color: var(--brand-border);box-shadow: 0 12px 40px rgba(37,42,48,.08);}
.admin-body .at-chat {background: var(--brand-50);}
.admin-body .at-message--ia, .admin-body .at-message--atendente {background: #f5efdf;border-color: #e4d7b7;}
.admin-body .at-conversation {border-color: var(--brand-border);}
.admin-body .at-toggle {border-color: var(--brand-border);}
.admin-body .at-days label {background: var(--brand-50);}
.admin-body .at-shell :focus-visible {outline-color: var(--brand-700);}

/* Acabamento sóbrio, sem efeitos decorativos nas ações. */
.admin-body .btn-admin, .admin-body .btn-admin-secondary,
.admin-body .btn-admin-success, .admin-body .btn-admin-danger,
.admin-body .btn-admin-warning {border-radius: 6px;box-shadow: none;}
.admin-body .btn-admin:hover, .admin-body .btn-admin-secondary:hover {transform: none;}
.admin-body .at-panel, .admin-body .at-metrics article,
.admin-body .at-inbox {border-radius: 8px;box-shadow: none;}
.admin-body .ops-panel {box-shadow: none;}
.admin-body .ops-page-heading h2, .admin-body .at-heading h2 {font-weight: 700;}
.admin-login-card, .premium-login-card {border-radius: 10px;}
.admin-login-body .input-shell input:focus,
.admin-login-body .input-shell input:focus-visible {
  box-shadow: none !important;
  outline: none;
  background: transparent;
}
