/* Modern application theme augmenting legacy layout, focused on builder forms */
:root {
  --app-font-size-base: 13px;
  --app-font-size-small: 12px;
  --app-font-family: "Segoe UI", Tahoma, Arial, sans-serif;
  --app-radius-sm: 4px;
  --app-radius-pill: 30px;
  --app-shadow-sm: 0 1px 2px rgba(0,0,0,.08), 0 0 0 1px rgba(0,0,0,.04);
  --app-shadow-md: 0 4px 10px rgba(0,0,0,.12);
  --app-color-text: #18222f;
  --app-color-muted: #6b7280;
  --app-color-border: #d4dbe3;
  --app-color-border-soft: #e4e9ee;
  --app-color-bg-soft: #f3f6f9;
  --app-gradient-ucm: linear-gradient(135deg,#059669,#10b981);
  --app-gradient-scm: linear-gradient(135deg,#dc2626,#ef4444);
  --app-gradient-luc: linear-gradient(135deg,#d97706,#f59e0b);
  --app-gradient-neutral: linear-gradient(135deg,#334155,#475569);
  --app-color-ucm:#059669;
  --app-color-scm:#dc2626;
  --app-color-luc:#d97706;
}

body.legacy-body { font-size: var(--app-font-size-base); }

/* Card polishing */
.card { border-radius: var(--app-radius-sm); box-shadow: var(--app-shadow-sm); }
.card > .card-header { background: #fff; border-bottom: 1px solid var(--app-color-border-soft); font-weight:600; font-size: var(--app-font-size-small); letter-spacing:.3px; }
.card > .card-header h5, .card > .card-header strong { font-size: 14px; font-weight:600; }
.card > .card-footer { background:#fff; }

/* Builder forms */
.builder-form { font-size: var(--app-font-size-small); }
.builder-form .form-label { font-size: 11.5px; font-weight:600; letter-spacing:.5px; color: var(--app-color-muted); }
.builder-form .form-control, .builder-form .form-select { font-size: 12.5px; padding: .3rem .55rem; }
.builder-form textarea.form-control { font-family: monospace; }
.builder-form fieldset { border:1px solid var(--app-color-border); border-radius: var(--app-radius-sm); }
.builder-form legend { font-size:11px; font-weight:600; letter-spacing:.5px; }

/* Tables */
.builder-table-wrapper { border:1px solid var(--app-color-border); border-radius: var(--app-radius-sm); background:#fff; }
.table.builder-table { margin:0; }
.table.builder-table thead th { background:#103a68; color:#fff; font-weight:500; font-size:11.5px; border-color:#0b2d50; position:sticky; top:0; z-index:2; }
.table.builder-table td, .table.builder-table th { vertical-align:middle; }
.table.builder-table td { font-size:12px; background:#fff; }
.table.builder-table tbody tr:nth-child(even) td { background:#f8fafc; }
.table.builder-table tbody tr:hover td { background:#eef5ff; }

/* Action buttons */
.btn-pill { border-radius: var(--app-radius-pill); font-weight:600; letter-spacing:.3px; box-shadow: var(--app-shadow-sm); font-size:12px; padding:.4rem .95rem; display:inline-flex; align-items:center; gap:.4rem; }

/* Typography */
.text-navy { color: #0c2d55 !important; }

/* Data Table Component (dt-table) - Overrides builder-table headers */
.table.dt-table thead th {
    background-color: #f2f6fa !important;
    color: #596c8e !important;
    font-weight: 600;
    font-size: 11px;
    text-transform: none; /* Proper case */
    border-bottom: 1px solid #dce4ec;
    border-top: 1px solid #dce4ec;
}
.table.dt-table tbody tr:nth-child(even) td {
    background-color: #f8fafc;
}
.btn-pill i { opacity:.9; }
.btn-gradient { color:#fff !important; border:0; position:relative; overflow:hidden; }
.btn-gradient:before { content:""; position:absolute; inset:0; background:linear-gradient(135deg,rgba(255,255,255,.2),rgba(255,255,255,0)); opacity:0; transition:.3s; }
.btn-gradient:hover:before { opacity:1; }
.btn-gradient:hover { filter:brightness(1.05); box-shadow:0 3px 12px rgba(0,0,0,.18); }
.btn-gradient:active { transform:translateY(1px); box-shadow:0 1px 4px rgba(0,0,0,.25); }
.btn-ucm { background: var(--app-gradient-ucm); }
.btn-scm { background: var(--app-gradient-scm); }
.btn-luc { background: var(--app-gradient-luc); }
.btn-neutral { background: var(--app-gradient-neutral); color:#fff !important; }

/* Outline soft buttons */
.btn-outline-soft { border:1px solid var(--app-color-border); background:#fff; color:var(--app-color-text); }
.btn-outline-soft:hover { background:var(--app-color-bg-soft); }

/* Badges */
.badge { font-weight:500; letter-spacing:.4px; }
.badge.status-DRAFT { background:#6b7280; }
.badge.status-SENT { background:#059669; }
.badge.status-ERROR { background:#b30000; }

/* Message log polishes */
.message-log-filters .btn { font-size:11.5px; }
.message-preview code { font-size:11px; color:#334155; }

/* Scroll area improvements */
.scroll-shadow { position:relative; }
.scroll-shadow:before { content:""; position:absolute; left:0; right:0; top:0; height:10px; pointer-events:none; background:linear-gradient(to bottom,rgba(0,0,0,.08),rgba(0,0,0,0)); }
.scroll-shadow:after { content:""; position:absolute; left:0; right:0; bottom:0; height:12px; pointer-events:none; background:linear-gradient(to top,rgba(0,0,0,.07),rgba(0,0,0,0)); }

/* Utility */
.text-monospace { font-family:monospace; }
.w-70px { width:70px !important; }
.w-80px { width:80px !important; }
.w-90px { width:90px !important; }
.w-100px { width:100px !important; }
.w-110px { width:110px !important; }
.w-120px { width:120px !important; }
.w-150px { width:150px !important; }

/* Remove old inline necessity */
.table-responsive.max-h-65vh { max-height:65vh; }

/* Focus */
.form-control:focus, .form-select:focus { box-shadow:0 0 0 2px rgba(31,124,255,.25); }

/* Animations */
.fade-in { animation:fade .35s ease; }
@keyframes fade { from { opacity:0; transform:translateY(4px);} to {opacity:1; transform:translateY(0);} }

/* Personal preference selector */
.preference-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:12px; margin-top:8px; }
.preference-item { position:relative; background:#fff; border:2px solid var(--app-color-border-soft); border-radius:10px; padding:14px 10px 12px; cursor:pointer; text-align:center; transition:.25s; box-shadow:var(--app-shadow-sm); }
.preference-item i { display:block; font-size:26px; margin-bottom:6px; color:#0c5191; opacity:.9; }
.preference-item .label { font-size:12px; font-weight:600; letter-spacing:.3px; }
.preference-item input { position:absolute; inset:0; opacity:0; cursor:pointer; }
.preference-item:hover { border-color:#5aa2ff; }
.preference-item input:focus-visible + .focus-ring { outline:2px solid #2563eb; outline-offset:2px; }
.preference-item.selected { border-color:#1d6dff; box-shadow:0 0 0 3px rgba(29,109,255,.25); }
.preference-item.selected i { color:#1d6dff; }
.preference-item.selected .label { color:#1d4ed8; }
.preferences-section-title { font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.5px; color:var(--app-color-muted); margin-top:18px; }

/* Profile / Preferences view */
.profile-wrapper { display:flex; flex-wrap:wrap; gap:18px; }
.profile-main { flex:1 1 540px; min-width:480px; }
.profile-workbench { width:270px; flex:0 0 270px; display:flex; flex-direction:column; gap:14px; }
.profile-card { background:#fff; border:1px solid var(--app-color-border-soft); border-radius:10px; padding:18px 18px 14px; box-shadow:var(--app-shadow-sm); position:relative; }
.profile-card h6 { font-size:12px; text-transform:uppercase; letter-spacing:.6px; font-weight:700; margin:0 0 14px; color:var(--app-color-muted); }
.profile-field { display:flex; padding:6px 0; border-bottom:1px solid #eef2f6; font-size:12.5px; }
.profile-field:last-child { border-bottom:none; }
.profile-field .label { width:140px; font-weight:600; color:#334155; }
.profile-field .value { flex:1; color:#1e293b; }
.profile-actions .btn-pill { width:100%; justify-content:flex-start; }
.profile-actions .btn-gradient { box-shadow:none; }
@media (max-width:900px){ .profile-workbench { width:100%; flex:1 1 100%; order:2; } }

/* Sidebar action navigation */
.sidebar-actions { margin-top:4px; }
.sidebar-actions .nav-action { display:block; position:relative; border:1px solid var(--app-color-border); background:#fff; border-radius:8px; padding:6px 10px 6px 38px; font-size:12.5px; font-weight:600; color:var(--app-color-text); text-decoration:none; margin-bottom:8px; line-height:18px; transition:.25s; box-shadow: var(--app-shadow-sm); }
.sidebar-actions .nav-action i { position:absolute; left:10px; top:50%; transform:translateY(-50%); font-size:14px; opacity:.85; }
.sidebar-actions .nav-action.nav-ucm { border-color: var(--app-color-ucm); }
.sidebar-actions .nav-action.nav-scm { border-color: var(--app-color-scm); }
.sidebar-actions .nav-action.nav-luc { border-color: var(--app-color-luc); }
.sidebar-actions .nav-action.nav-pref { border-color:#1d6dff; }
.sidebar-actions .nav-action.nav-carrier { border-color:#6366f1; }
.sidebar-actions .nav-action.nav-station { border-color:#0ea5e9; }
.sidebar-actions .nav-action.nav-admin { border-color:#475569; }
.sidebar-actions .nav-action.nav-participant { border-color:#d97706; }
.sidebar-actions .nav-action.nav-uld-import { border-color:#9333ea; }
.sidebar-actions .nav-action:hover { background:var(--app-color-bg-soft); text-decoration:none; }
.sidebar-actions .nav-action.active { color:#fff; }
.sidebar-actions .nav-action.active.nav-ucm { background:var(--app-gradient-ucm); border-color:transparent; }
.sidebar-actions .nav-action.active.nav-scm { background:var(--app-gradient-scm); border-color:transparent; }
.sidebar-actions .nav-action.active.nav-luc { background:var(--app-gradient-luc); border-color:transparent; }
.sidebar-actions .nav-action.active.nav-pref { background:linear-gradient(135deg,#1d6dff,#3b82f6); border-color:transparent; }
.sidebar-actions .nav-action.active.nav-carrier { background:linear-gradient(135deg,#6366f1,#818cf8); border-color:transparent; }
.sidebar-actions .nav-action.active.nav-station { background:linear-gradient(135deg,#0ea5e9,#38bdf8); border-color:transparent; }
.sidebar-actions .nav-action.active.nav-admin { background:linear-gradient(135deg,#475569,#64748b); border-color:transparent; }
.sidebar-actions .nav-action.active.nav-participant { background:linear-gradient(135deg,#d97706,#f59e0b); border-color:transparent; }
.sidebar-actions .nav-action.active.nav-uld-import { background:linear-gradient(135deg,#7e22ce,#a855f7); border-color:transparent; }
.sidebar-actions .nav-action:active { transform:translateY(1px); }
.sidebar-actions .nav-action .badge { position:absolute; right:8px; top:6px; }

/* Tighten section headers when using new actions */
.legacy-sidebar .menu-section .section-header + .sidebar-actions { margin-top:6px; }

/* Modern log links inline styling */
.log-links-modern { display:flex; gap:6px; width:100%; }
.log-links-modern .nav-action { flex:1 1 0; margin-bottom:0; }

/* Disabled/Readonly Inputs */
.form-control:disabled, .form-control[readonly],
.form-select:disabled, .form-select[readonly] {
  background-color: #f1f3f5;
  color: #6c757d;
  cursor: not-allowed;
  border-color: var(--app-color-border-soft);
  box-shadow: none !important;
}

.form-control:disabled:focus, .form-control[readonly]:focus,
.form-select:disabled:focus, .form-select[readonly]:focus {
  border-color: var(--app-color-border-soft);
  box-shadow: none !important;
}
