:root { --ccima-navy:#0b1d44; --ccima-red:#d71920; --ccima-bg:#f3f6fa; --ccima-muted:#667085; }
@font-face { font-family:'FontAwesome'; src:url('../fonts/fontawesome-webfont.woff2') format('woff2'); font-weight:normal; font-style:normal; }
* { box-sizing:border-box; }
body { background:var(--ccima-bg); color:#1d2939; font-family:Arial,Helvetica,sans-serif; margin:0; }
.standalone-header { background:#fff; border-bottom:3px solid var(--ccima-red); box-shadow:0 3px 14px rgba(11,29,68,.08); }
.standalone-header__content { align-items:center; display:flex; justify-content:space-between; min-height:72px; padding-left:28px; padding-right:28px; }
.standalone-brand { align-items:center; display:flex; gap:13px; }.standalone-brand img { height:52px; width:52px; object-fit:cover; }.standalone-brand strong { color:var(--ccima-navy); display:block; font-size:18px; letter-spacing:1px; }.standalone-brand span { color:var(--ccima-muted); font-size:11px; text-transform:uppercase; }
.standalone-badge { background:#eef2f8; border-radius:20px; color:var(--ccima-navy); font-size:12px; padding:8px 13px; }
.standalone-user { align-items:center; display:flex; gap:14px; }.standalone-user>span { color:var(--ccima-navy); font-size:13px; font-weight:600; }
.page-content { margin:0; padding:0; }
.responsivas-page { background:var(--ccima-bg); min-height:calc(100vh - 56px); padding-bottom:48px; }
.responsivas-hero { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:36px 4px 24px; }
.responsivas-hero h1 { color:var(--ccima-navy); font-size:30px; font-weight:700; margin:4px 0 8px; }
.responsivas-hero p,.responsiva-modal-header p { color:var(--ccima-muted); margin:0; }
.responsivas-eyebrow { color:var(--ccima-red); font-size:11px; font-weight:700; letter-spacing:1.5px; }
.responsivas-hero .btn-primary,.responsiva-modal-footer .btn-primary { background:var(--ccima-navy); border-color:var(--ccima-navy); }
.responsivas-dashboard { display:grid; grid-template-columns:minmax(280px,.8fr) minmax(480px,1.2fr); gap:18px; margin-bottom:22px; }
.responsivas-stats { display:grid; grid-template-columns:1fr; gap:12px; margin:0; }
.responsivas-stats article { background:#fff; border:1px solid #e5e9f0; border-radius:10px; padding:18px 22px; box-shadow:0 4px 14px rgba(11,29,68,.04); }
.responsivas-stats span { color:var(--ccima-navy); display:block; font-size:23px; font-weight:700; }
.responsivas-stats small { color:var(--ccima-muted); font-size:12px; }
.responsivas-chart-card { align-items:center; background:#fff; border:1px solid #e5e9f0; border-radius:10px; box-shadow:0 4px 14px rgba(11,29,68,.04); display:grid; grid-template-columns:1fr 280px; gap:16px; padding:20px 24px; }
.responsivas-chart-copy h2 { color:var(--ccima-navy); font-size:18px; font-weight:700; margin:4px 0 6px; }.responsivas-chart-copy>p { color:var(--ccima-muted); font-size:12px; margin:0 0 14px; }
.responsivas-chart-wrap { height:260px; position:relative; width:260px; }.responsivas-chart-wrap canvas { display:block; height:260px; width:260px; }
.responsivas-chart-tooltip { background:var(--ccima-navy); border-radius:6px; color:#fff; font-size:12px; left:0; padding:7px 10px; pointer-events:none; position:absolute; top:0; transform:translate(-50%,-115%); white-space:nowrap; z-index:3; }
.responsivas-chart-legend { display:grid; gap:6px; }.responsivas-chart-legend div { align-items:center; color:#475467; display:flex; font-size:11px; gap:7px; }.responsivas-chart-legend i { border-radius:3px; display:inline-block; height:9px; width:9px; }
.responsivas-chart-empty { align-items:center; color:#98a2b3; display:flex; font-size:13px; height:260px; justify-content:center; text-align:center; }
.responsivas-card { border:0; border-radius:10px; box-shadow:0 6px 24px rgba(11,29,68,.06); overflow:hidden; }
.responsivas-card-header { align-items:center; background:#fff; border-bottom:1px solid #edf0f4; display:flex; justify-content:space-between; padding:18px 22px; }
.responsivas-card-header strong { color:var(--ccima-navy); display:block; font-size:16px; }
.responsivas-card-header span { color:var(--ccima-muted); font-size:12px; }
.responsivas-search { align-items:center; background:#f6f7f9; border:1px solid #e3e7ed; border-radius:7px; display:flex; gap:8px; margin:0; padding:8px 12px; width:300px; }
.responsivas-toolbar { align-items:center; display:flex; gap:8px; }.responsivas-toolbar .btn { align-items:center; display:inline-flex; gap:6px; min-height:38px; }
.responsivas-search i { color:#98a2b3; }.responsivas-search input { background:transparent; border:0; outline:0; width:100%; }
.responsivas-table { margin:0; }.responsivas-table thead th { background:#fafbfc; border-bottom:1px solid #e9edf2; color:#667085; font-size:11px; letter-spacing:.3px; text-transform:uppercase; }
.responsivas-table td,.responsivas-table th { padding:14px 20px; vertical-align:middle; }.responsivas-table td strong { color:var(--ccima-navy); }
.responsivas-empty { color:var(--ccima-muted); padding:54px 20px; text-align:center; }.responsivas-empty h3 { color:var(--ccima-navy); font-size:18px; margin:12px 0 5px; }.responsivas-empty p { margin:0; }
.responsivas-empty-icon { align-items:center; background:#eef2f8; border-radius:50%; color:var(--ccima-navy); display:inline-flex; font-size:28px; height:66px; justify-content:center; width:66px; }
.responsiva-modal { max-width:900px; }.responsiva-modal .modal-content { border:0; border-radius:12px; overflow:hidden; }.responsiva-modal-header { align-items:flex-start; border-bottom:1px solid #e8ecf1; padding:22px 28px; }.responsiva-modal-header h2 { color:var(--ccima-navy); font-size:22px; font-weight:700; margin:2px 0 4px; }
.responsiva-modal-body { max-height:68vh; overflow-y:auto; padding:24px 30px 12px; }.responsiva-progress { align-items:center; display:flex; margin:0 auto 30px; max-width:690px; }.responsiva-progress button { background:transparent; border:0; color:#98a2b3; font-size:11px; padding:0; text-transform:uppercase; }.responsiva-progress button span { align-items:center; background:#e9edf3; border-radius:50%; color:#667085; display:flex; font-size:12px; font-weight:700; height:30px; justify-content:center; margin:0 auto 5px; width:30px; }.responsiva-progress button.active { color:var(--ccima-navy); font-weight:700; }.responsiva-progress button.active span,.responsiva-progress button.done span { background:var(--ccima-navy); color:#fff; }.responsiva-progress i { background:#dfe4eb; flex:1; height:1px; margin:0 12px 18px; }
.responsiva-step { display:none; }.responsiva-step.active { display:block; }.responsiva-section-title { align-items:center; display:flex; gap:12px; margin-bottom:20px; }.responsiva-section-title>span { align-items:center; background:#eef2f8; border-radius:8px; color:var(--ccima-navy); display:flex; font-size:19px; height:42px; justify-content:center; width:42px; }.responsiva-section-title h3 { color:var(--ccima-navy); font-size:17px; font-weight:700; margin:0 0 2px; }.responsiva-section-title p { color:var(--ccima-muted); font-size:12px; margin:0; }
.responsiva-step label { color:#344054; font-size:12px; font-weight:600; }.responsiva-step .form-control { border:1px solid #d9dfe7; border-radius:6px; min-height:39px; }.responsiva-step .form-control:focus { border-color:#8091b5; box-shadow:0 0 0 3px rgba(11,29,68,.08); }.responsiva-step .form-control.is-invalid { border-color:var(--ccima-red); }
.responsiva-security-note { align-items:center; display:flex; gap:10px; font-size:12px; }.responsiva-security-note i { font-size:18px; }.responsiva-review { align-items:center; background:#eff8f3; border:1px solid #cbe8d6; border-radius:8px; display:flex; gap:13px; margin-top:12px; padding:15px 18px; }.responsiva-review i { color:#218653; font-size:24px; }.responsiva-review strong { color:#17663e; }.responsiva-review p { color:#47715c; margin:2px 0 0; }
.responsiva-modal-footer { align-items:center; border-top:1px solid #e8ecf1; padding:15px 28px; }.responsiva-required { color:#98a2b3; font-size:11px; margin-right:auto; }.responsiva-modal-footer .btn { min-width:105px; }.responsiva-modal-footer .btn-danger { background:var(--ccima-red); border-color:var(--ccima-red); }
.login-page { align-items:center; background:linear-gradient(145deg,#eef2f8,#f8f9fb); display:flex; justify-content:center; min-height:100vh; padding:24px; }.login-card { background:#fff; border-radius:14px; box-shadow:0 18px 55px rgba(11,29,68,.14); max-width:410px; padding:34px; width:100%; }.login-card>img { display:block; height:86px; margin:0 auto 18px; object-fit:cover; width:86px; }.login-card h1 { color:var(--ccima-navy); font-size:25px; font-weight:700; margin:5px 0 7px; }.login-card>p { color:var(--ccima-muted); font-size:13px; margin-bottom:22px; }.login-card label { color:#344054; font-size:12px; font-weight:600; }.login-card .btn-primary { background:var(--ccima-navy); border-color:var(--ccima-navy); padding:10px; }
.login-password-group { margin-bottom:22px; }.login-password { position:relative; width:100%; }.login-password .form-control { padding-right:48px; width:100%; }.login-password button { align-items:center; background:transparent; border:0; border-left:1px solid #e4e7ec; bottom:1px; color:#667085; cursor:pointer; display:flex; font-size:17px; justify-content:center; margin:0; padding:0; position:absolute; right:1px; top:1px; width:42px; z-index:2; }.login-password button:hover,.login-password button:focus { background:#f7f8fa; color:var(--ccima-navy); outline:0; }.login-submit { margin-top:4px; min-height:42px; }
@media (max-width:900px) { .responsivas-dashboard { grid-template-columns:1fr; }.responsivas-stats { grid-template-columns:repeat(3,1fr); }.responsivas-chart-card { grid-template-columns:1fr 260px; } }
@media (max-width:767px) { .standalone-header__content { align-items:flex-start; flex-direction:column; gap:10px; padding-bottom:14px; padding-top:14px; }.standalone-user { justify-content:space-between; width:100%; }.responsivas-hero { align-items:stretch; flex-direction:column; }.responsivas-stats { grid-template-columns:1fr; }.responsivas-chart-card { grid-template-columns:1fr; }.responsivas-chart-wrap { margin:auto; }.responsivas-toolbar { align-items:stretch; flex-wrap:wrap; margin-top:12px; }.responsivas-search { margin:0; width:100%; }.responsivas-toolbar .btn { flex:1; justify-content:center; }.responsivas-card-header { align-items:stretch; flex-direction:column; }.responsiva-modal-body { padding:20px 18px 8px; }.responsiva-progress button { font-size:0; }.responsiva-progress i { margin-left:6px; margin-right:6px; }.responsiva-modal-footer { padding:13px 18px; }.responsiva-required { display:none; } }