/*
FILE: web/css/runtime_auth_card_colors_refined_v18_48.css
ROLE: refined auth/portal card border colors
STATUS: active patch v18.48
DOES:
- improves card border colors for client / partner / admin auth
- keeps borders fine, not thick
- removes dirty/yellow-heavy frame feeling
- keeps dark single-layer auth surface from v18.47
DOES NOT:
- touch backend, database, API, sessions, passwords, flows, jobs
*/

:root{
  --abc-card-client-line: rgba(245, 203, 92, .30);
  --abc-card-client-glow: rgba(245, 203, 92, .055);
  --abc-card-client-text: #ffe39a;

  --abc-card-partner-line: rgba(168, 132, 255, .32);
  --abc-card-partner-glow: rgba(168, 132, 255, .065);
  --abc-card-partner-text: #d8c8ff;

  --abc-card-admin-line: rgba(75, 220, 145, .32);
  --abc-card-admin-glow: rgba(75, 220, 145, .065);
  --abc-card-admin-text: #a9f7c8;

  --abc-card-neutral-line: rgba(118, 148, 184, .18);
  --abc-card-input-line: rgba(96, 165, 250, .22);
  --abc-card-input-focus: rgba(96, 165, 250, .36);
}

/* Base card: fine, neutral, premium. */
body[data-page="auth_login"] .auth-panel-card,
body[data-page="auth_notice"] .auth-panel-card,
body[data-page="auth_login"] .auth-card,
body[data-page="auth_notice"] .auth-card{
  border-width: 1px !important;
  border-color: var(--abc-card-client-line) !important;
  background:
    linear-gradient(180deg, rgba(17, 31, 51, .985), rgba(7, 16, 29, .985)) !important;
  box-shadow:
    inset 0 0 0 1px var(--abc-card-client-glow),
    0 14px 30px rgba(0,0,0,.24) !important;
}

/* Client = warm, but not thick/gold-heavy. */
body[data-auth-panel-family="client"][data-page="auth_login"] .auth-panel-card,
body[data-auth-panel-family="client"][data-page="auth_notice"] .auth-panel-card,
body[data-auth-role="client"][data-page="auth_login"] .auth-panel-card,
body[data-auth-role="client"][data-page="auth_notice"] .auth-panel-card{
  border-color: var(--abc-card-client-line) !important;
  box-shadow:
    inset 0 0 0 1px var(--abc-card-client-glow),
    0 14px 30px rgba(0,0,0,.24) !important;
}

body[data-auth-panel-family="client"][data-page="auth_login"] .auth-panel-badge,
body[data-auth-panel-family="client"][data-page="auth_notice"] .auth-panel-badge{
  color: var(--abc-card-client-text) !important;
  border-color: rgba(245,203,92,.24) !important;
  background: rgba(245,203,92,.07) !important;
}

/* Partner = violet family. */
body[data-auth-panel-family="partner"][data-page="auth_login"] .auth-panel-card,
body[data-auth-panel-family="partner"][data-page="auth_notice"] .auth-panel-card,
body[data-auth-role="partner"][data-page="auth_login"] .auth-panel-card,
body[data-auth-role="partner"][data-page="auth_notice"] .auth-panel-card{
  border-color: var(--abc-card-partner-line) !important;
  box-shadow:
    inset 0 0 0 1px var(--abc-card-partner-glow),
    0 14px 30px rgba(0,0,0,.24) !important;
}

body[data-auth-panel-family="partner"][data-page="auth_login"] .auth-panel-badge,
body[data-auth-panel-family="partner"][data-page="auth_notice"] .auth-panel-badge{
  color: var(--abc-card-partner-text) !important;
  border-color: rgba(168,132,255,.25) !important;
  background: rgba(168,132,255,.075) !important;
}

/* Admin = green family, separate visually but same clean auth UI. */
body[data-auth-panel-family="admin"][data-page="auth_login"] .auth-panel-card,
body[data-auth-panel-family="admin"][data-page="auth_notice"] .auth-panel-card,
body[data-auth-role="admin"][data-page="auth_login"] .auth-panel-card,
body[data-auth-role="admin"][data-page="auth_notice"] .auth-panel-card{
  border-color: var(--abc-card-admin-line) !important;
  box-shadow:
    inset 0 0 0 1px var(--abc-card-admin-glow),
    0 14px 30px rgba(0,0,0,.24) !important;
}

body[data-auth-panel-family="admin"][data-page="auth_login"] .auth-panel-badge,
body[data-auth-panel-family="admin"][data-page="auth_notice"] .auth-panel-badge,
body[data-auth-role="admin"][data-page="auth_login"] .auth-panel-badge,
body[data-auth-role="admin"][data-page="auth_notice"] .auth-panel-badge{
  color: var(--abc-card-admin-text) !important;
  border-color: rgba(75,220,145,.25) !important;
  background: rgba(75,220,145,.075) !important;
}

/* Field cards: cleaner, less boxed/noisy. */
body[data-page="auth_login"] .auth-form-v9 .client-form-field,
body[data-page="auth_notice"] .auth-form-v9 .client-form-field{
  border-color: var(--abc-card-neutral-line) !important;
  background: rgba(5, 14, 26, .54) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.018) !important;
}

body[data-page="auth_login"] .auth-form-v9 input,
body[data-page="auth_notice"] .auth-form-v9 input{
  border-color: var(--abc-card-input-line) !important;
  background: rgba(2, 9, 20, .86) !important;
}

body[data-page="auth_login"] .auth-form-v9 input:focus,
body[data-page="auth_notice"] .auth-form-v9 input:focus{
  border-color: var(--abc-card-input-focus) !important;
  box-shadow: 0 0 0 3px rgba(96,165,250,.08) !important;
}

/* Buttons use cleaner line colors, no heavy old frame feeling. */
body[data-page="auth_login"] .auth-actions .button,
body[data-page="auth_notice"] .auth-actions .button,
body[data-page="auth_login"] .auth-actions button,
body[data-page="auth_notice"] .auth-actions button{
  border-color: rgba(96,165,250,.24) !important;
  background: rgba(26, 47, 82, .72) !important;
  box-shadow: none !important;
}

body[data-page="auth_login"] .auth-actions .button:hover,
body[data-page="auth_notice"] .auth-actions .button:hover,
body[data-page="auth_login"] .auth-actions button:hover,
body[data-page="auth_notice"] .auth-actions button:hover{
  border-color: rgba(125,185,255,.38) !important;
  background: rgba(35, 63, 108, .82) !important;
}

/* Explicitly keep all auth frame borders thin. */
body[data-page="auth_login"] .auth-panel-card,
body[data-page="auth_notice"] .auth-panel-card,
body[data-page="auth_login"] .auth-card,
body[data-page="auth_notice"] .auth-card,
body[data-page="auth_login"] .auth-form-v9 .client-form-field,
body[data-page="auth_notice"] .auth-form-v9 .client-form-field,
body[data-page="auth_login"] .auth-panel-badge,
body[data-page="auth_notice"] .auth-panel-badge{
  border-width: 1px !important;
}