:root { color-scheme: dark; --blue: #1769e0; --blue-light: #8fb9ff; --surface: #182238; --border: #33415d; --text: #f8fafc; --muted: #bdc8da; }
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; font-family: Inter, "Segoe UI", Arial, sans-serif; background: #101727; color: var(--text); }
a { color: var(--blue-light); text-decoration: none; }
h1, h2, p { margin-top: 0; }
h1 { font-size: clamp(2rem, 3vw, 2.65rem); margin-bottom: 8px; }
h2 { font-size: 1.35rem; }
p { color: var(--muted); line-height: 1.55; }
.page-header { margin-bottom: 30px; }
.page-header p:last-child { margin-bottom: 0; font-size: 1.05rem; }
.action-header { display: flex; justify-content: space-between; align-items: end; gap: 24px; }
.eyebrow { color: var(--blue-light) !important; font-size: .78rem !important; font-weight: 800; letter-spacing: .13em; margin-bottom: 8px !important; }
.panel, .stat-card { background: var(--surface); border: 1px solid var(--border); border-radius: 16px; box-shadow: 0 12px 28px #0002; }
.stat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-bottom: 28px; }
.four-stats { grid-template-columns: repeat(4, 1fr); }
.stat-card { padding: 24px; display: flex; flex-direction: column; gap: 12px; }
.stat-card span { color: var(--muted); font-weight: 600; }
.stat-card strong { font-size: 2.7rem; }
.quick-access { padding: 28px; display: flex; align-items: center; justify-content: space-between; gap: 28px; border-left: 5px solid var(--blue); }
.btn { min-height: 48px; padding: 11px 20px; border-radius: 10px; font-weight: 800; display: inline-flex; align-items: center; justify-content: center; }
.btn-primary { color: #fff; background: var(--blue); border-color: var(--blue); }
.btn-primary:hover { background: #0f56bd; border-color: #0f56bd; }
.btn-outline-light { color: #fff; border: 2px solid #75839b; }
.ministry-list { padding: 8px 24px; }
.ministry-row { min-height: 112px; padding: 18px 0; display: grid; grid-template-columns: 64px 1fr auto auto; gap: 20px; align-items: center; border-bottom: 1px solid var(--border); }
.ministry-row:last-child { border-bottom: 0; }
.multi-row { grid-template-columns: 64px minmax(220px, 1fr) auto minmax(300px, auto); }
.row-actions { display: flex; flex-wrap: wrap; gap: 9px; justify-content: flex-end; }
.row-actions .btn { min-height: 44px; padding: 8px 13px; font-size: .8rem; }
.btn-danger { color: #fff; background: #a61b1b; border: 1px solid #dc4545; }
.btn-danger:hover { background: #7f1d1d; }
.list-tools { display: grid; grid-template-columns: 2fr 1fr; gap: 20px; padding: 22px; margin-bottom: 22px; }
.empty-list { padding: 32px; color: var(--muted); text-align: center; font-size: 1.05rem; }
.confirmation-backdrop { position: fixed; inset: 0; z-index: 2000; background: #020617dd; display: grid; place-items: center; padding: 20px; }
.confirmation-card { width: min(560px, 100%); padding: 30px; background: var(--surface); border: 1px solid var(--border); border-radius: 16px; box-shadow: 0 24px 80px #0009; }
.confirmation-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 26px; }
.summary-source { display: flex; flex-direction: column; gap: 5px; margin-bottom: 24px; padding: 18px; background: #0e1627; border-radius: 10px; }
.summary-source span { color: var(--muted); }
.copy-list { margin-top: 26px; }
.copy-list li { margin-bottom: 9px; color: var(--muted); }
.data-note { margin-top: 22px; padding: 16px; border-left: 4px solid var(--blue); background: #0e1627; color: var(--muted); }
.publication-fields { margin-top: 20px; }
.dashboard-recent { padding: 26px; }
.recent-row { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 16px 0; border-bottom: 1px solid var(--border); }
.recent-row:last-child { border-bottom: 0; }
.recent-row strong, .recent-row small { display: block; }
.recent-row small { color: var(--muted); margin-top: 5px; }
.ministry-logo { width: 58px; height: 58px; border-radius: 14px; display: grid; place-items: center; background: var(--ministry-color); font-size: 1.6rem; }
.ministry-details h2 { margin-bottom: 5px; }
.ministry-details p { margin: 0; }
.status { border-radius: 999px; padding: 8px 13px; font-weight: 800; font-size: .86rem; white-space: nowrap; }
.status-active { background: #14532d; color: #bbf7d0; }
.status-indevelopment { background: #543b08; color: #fde68a; }
.status-suspended { background: #5f1b1b; color: #fecaca; }
.save-notice { background: #14532d; border: 1px solid #4ade80; color: #dcfce7; padding: 15px 18px; border-radius: 10px; margin-bottom: 22px; font-weight: 700; }
.data-error { background: #5f1b1b; border: 1px solid #f87171; color: #fee2e2; padding: 15px 18px; border-radius: 10px; margin-bottom: 22px; font-weight: 700; }
.form-section { padding: 28px; margin-bottom: 22px; }
.section-heading { display: flex; gap: 16px; padding-bottom: 20px; margin-bottom: 22px; border-bottom: 1px solid var(--border); }
.section-heading > span { width: 42px; height: 42px; flex: 0 0 42px; display: grid; place-items: center; background: var(--blue); border-radius: 10px; font-weight: 900; }
.section-heading h2 { margin: 0 0 4px; }
.section-heading p { margin: 0; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.field { display: flex; flex-direction: column; gap: 8px; color: #fff; font-weight: 700; }
.field.full { grid-column: 1 / -1; }
.form-control, .form-select { min-height: 50px; background: #0e1627; border: 1px solid #52617c; color: #fff; border-radius: 9px; padding: 11px 13px; }
.form-control:focus, .form-select:focus { background: #0e1627; color: #fff; border-color: var(--blue-light); box-shadow: 0 0 0 3px #1769e044; }
.color-field { display: grid; grid-template-columns: 1fr 58px; gap: 10px; }
.color-field input[type=color] { width: 58px; height: 50px; padding: 4px; border: 1px solid #52617c; border-radius: 9px; background: #0e1627; }
.logo-preview { min-height: 88px; padding: 18px; display: flex; align-items: center; gap: 16px; background: #0e1627; border: 1px dashed #52617c; border-radius: 10px; }
.logo-preview span { width: 50px; height: 50px; display: grid; place-items: center; background: var(--ministry-color); border-radius: 12px; }
.toggle-row { min-height: 68px; display: flex; align-items: center; gap: 15px; background: #0e1627; border: 1px solid #3b4962; border-radius: 11px; padding: 13px 16px; margin-bottom: 18px; cursor: pointer; }
.toggle-row input { width: 24px; height: 24px; accent-color: var(--blue); }
.toggle-row span, .toggle-row small { display: block; }
.toggle-row small { color: var(--muted); margin-top: 3px; }
.module-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.module-grid .toggle-row { margin: 0; }
.form-actions { position: sticky; bottom: 0; padding: 18px 0; background: linear-gradient(transparent, #101727 28%); display: flex; justify-content: flex-end; }
.validation-message { color: #fca5a5; font-weight: 600; }
.invalid { border-color: #ef4444 !important; }
#blazor-error-ui { display: none; }
.login-shell { min-height: 100vh; display: grid; place-items: center; padding: 2rem; background: radial-gradient(circle at top, #302020, #090909 55%); }
.login-card { width: min(100%, 520px); padding: 2.5rem; border: 1px solid #555; border-radius: 20px; background: #151515; box-shadow: 0 24px 80px #000; }
.login-card h1 { font-size: 2.35rem; margin: .5rem 0; }
.login-mark { margin-bottom: 1.5rem; }
.login-form { display: grid; gap: 1.25rem; margin-top: 2rem; }
.remember-row { display: flex; gap: .75rem; align-items: center; min-height: 48px; font-size: 1.05rem; }
.logout-button { width: 100%; border: 0; background: transparent; text-align: left; margin-top: 1rem; }
.permission-fieldset { min-width: 0; border: 0; padding: 0; margin: 0; }
.permission-fieldset:disabled { opacity: .82; }
.assignment-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: .8rem; margin: 1.25rem 0; }
.assignment-grid label { min-height: 52px; display: flex; align-items: center; gap: .7rem; padding: .7rem; border: 1px solid #555; border-radius: 10px; }
.user-row { grid-template-columns: 1fr auto; }
.content-editor-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; padding: 1.2rem 0; border-bottom: 1px solid #444; }
.schedule-editor-row { display: grid; grid-template-columns: 170px 1fr 1fr 100px; gap: 1rem; align-items: center; padding: .8rem 0; border-bottom: 1px solid #444; }
.media-center-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1.25rem; margin-bottom: 1.5rem; }
.media-card { min-height: 280px; display: flex; flex-direction: column; justify-content: space-between; gap: 1rem; padding: 1.5rem; border: 1px solid #555; border-radius: 16px; background: #171717; }
.media-card h2 { font-size: 1.6rem; margin-top: 1rem; }.media-card strong { display: block; margin-top: 1rem; color: #fff; }
.available-modules { display: grid; gap: .8rem; }.available-modules > div { display: flex; justify-content: space-between; align-items: center; padding: 1rem; border: 1px solid #555; border-radius: 10px; }
.center-actions { display: flex; gap: 1rem; justify-content: flex-end; padding: 1.5rem 0; }
.video-sync-row { display: flex; justify-content: space-between; gap: 1rem; align-items: center; }.video-sync-row small { color: #ddd; }
.program-editor,.podcast-editor,.schedule-admin-row { margin-bottom: 1rem; }.schedule-tools { display: grid; grid-template-columns: 1fr 1fr auto auto auto; gap: 1rem; align-items: end; }
.phone-preview { width: min(390px, 100%); min-height: 700px; margin: 2rem auto; padding: 3rem 1.4rem 2rem; border: 10px solid #333; border-radius: 42px; background: #050505; text-align: center; box-shadow: 0 30px 90px #000; }
.phone-speaker { width: 90px; height: 8px; margin: -1.5rem auto 2.5rem; background: #444; border-radius: 10px; }.phone-preview h2 { color: var(--preview-color); font-size: 1.8rem; }.phone-preview button { display: block; width: 100%; min-height: 62px; margin: 1rem 0; color: white; font-weight: 800; background: var(--preview-color); border: 0; border-radius: 12px; }.preview-social { display: flex; flex-wrap: wrap; justify-content: center; gap: .7rem; margin-top: 2rem; }
.object-upload-box { margin: 1.25rem 0; padding: 1.2rem; border: 1px solid #555; border-radius: 14px; background: #101010; }.object-upload-box progress { width: min(100%, 560px); height: 20px; margin: 1rem .7rem 0 0; }.file-picker { position: relative; overflow: hidden; }.file-picker input[type=file] { position: absolute; inset: 0; opacity: 0; cursor: pointer; }.cover-box { display: flex; justify-content: space-between; gap: 1rem; align-items: center; }.cover-box img { display: block; width: 130px; height: 130px; object-fit: cover; border-radius: 12px; margin-bottom: .8rem; }
@media (max-width: 900px) { .schedule-tools { grid-template-columns: 1fr; }.schedule-editor-row,.content-editor-row { grid-template-columns: 1fr; }.center-actions { flex-direction: column; } }
@media (max-width: 1000px) { .four-stats { grid-template-columns: repeat(2, 1fr); } .multi-row { grid-template-columns: 58px 1fr auto; } .multi-row .row-actions { grid-column: 2 / -1; justify-content: flex-start; } }
@media (max-width: 760px) { .stat-grid, .form-grid, .module-grid, .list-tools { grid-template-columns: 1fr; } .action-header, .quick-access { align-items: stretch; flex-direction: column; } .ministry-row { grid-template-columns: 58px 1fr; } .ministry-row .status, .ministry-row .btn { grid-column: 2; justify-self: start; } .multi-row .row-actions { grid-column: 2; } .confirmation-actions { flex-direction: column; } }
/* ITMS Factory */
.factory-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 22px; }
.factory-card { display: grid; align-content: start; gap: 18px; padding: 24px; background: #141e32; border: 1px solid #33415f; border-radius: 16px; }
.factory-card h3 { margin: 0 0 6px; font-size: 1.3rem; }
.factory-card p { margin: 0; color: #cbd5e1; }
.factory-validation { padding: 16px; color: #fff; background: #632222; border-radius: 10px; }
.factory-validation ul { margin: 10px 0 0; padding-left: 24px; }
.assignment-option { display: flex; gap: 12px; align-items: flex-start; color: #e5e7eb; line-height: 1.4; }
.assignment-option input { width: 22px; height: 22px; flex: 0 0 auto; }
.template-status { display: grid; grid-template-columns: 1fr auto; gap: 18px; align-items: center; margin-bottom: 24px; }
.template-status h2 { margin: 4px 0 8px; }
.template-status code { color: #fff; font-size: 1rem; }
.template-invalid { border-color: #b91c1c; }
.template-status .factory-validation { grid-column: 1 / -1; }
.branding-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:1.25rem; margin-top:1.25rem; }
.branding-card { background:#151515; border:1px solid #444; border-radius:18px; padding:1rem; display:flex; flex-direction:column; gap:.7rem; }
.branding-card h3,.branding-card p { margin:0; }
.branding-preview { min-height:190px; border-radius:14px; background:#080808; display:grid; place-items:center; overflow:hidden; font-size:4rem; }
.branding-preview img { width:100%; height:220px; object-fit:contain; }
/* Dashboard comercial */
.analytics-filters { display:grid; grid-template-columns:repeat(4,minmax(150px,1fr)); gap:16px; padding:22px; margin-bottom:18px; align-items:end; }
.analytics-meta { display:flex; flex-wrap:wrap; gap:12px 26px; padding:12px 2px 22px; color:var(--muted); }
.kpi-grid { display:grid; grid-template-columns:repeat(4,minmax(210px,1fr)); gap:16px; margin-bottom:20px; }
.kpi-card { min-height:148px; display:flex; flex-direction:column; gap:9px; padding:20px; background:linear-gradient(145deg,#18243b,#141d30); border:1px solid var(--border); border-radius:15px; box-shadow:0 10px 24px #0003; }
.kpi-card span { color:#b9c8de; font-size:.78rem; font-weight:900; letter-spacing:.06em; }.kpi-card strong { font-size:clamp(1.6rem,2.4vw,2.35rem); }.kpi-card small { color:var(--muted); line-height:1.35; }
.pending-strip,.payout-kpis { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px; margin-bottom:20px; }.pending-strip>div,.payout-kpis>span { display:flex; flex-direction:column; gap:5px; padding:15px; border:1px solid var(--border); border-radius:11px; background:#0e1627; color:var(--muted); }.pending-strip strong,.payout-kpis strong { color:#fff; font-size:1.18rem; }
.analytics-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; margin-bottom:20px; }.chart-panel,.analytics-section { padding:24px; overflow:hidden; }.chart-panel h2,.analytics-section h2 { letter-spacing:.035em; }
.bar-chart { height:230px; display:flex; align-items:flex-end; gap:8px; padding:15px 8px 34px; border-bottom:1px solid #55627a; background:repeating-linear-gradient(to top,transparent 0,transparent 44px,#ffffff0c 45px); overflow-x:auto; }.bar-group { min-width:42px; height:100%; display:flex; flex:1; flex-direction:column; justify-content:flex-end; align-items:center; gap:7px; }.bar-group .bar { width:min(34px,75%); min-height:4px; border-radius:7px 7px 2px 2px; }.bar.revenue { background:#4c9aff; }.bar.subscription { background:#36c991; }.bar-group span { font-size:.68rem; color:var(--muted); white-space:nowrap; }
.analytics-table { width:100%; border-collapse:collapse; margin-top:16px; font-size:.88rem; }.analytics-table th,.analytics-table td { padding:11px 9px; text-align:left; border-bottom:1px solid #34425b; }.analytics-table th { color:#c9d8ed; background:#10192a; }.table-scroll { overflow-x:auto; }
.funnel { display:grid; gap:8px; }.funnel>div { display:grid; grid-template-columns:1fr auto minmax(110px,auto); gap:12px; padding:11px 15px; background:#10233d; border-left:4px solid #4c9aff; border-radius:7px; }.funnel small { color:var(--muted); text-align:right; }
.status-row { display:grid; grid-template-columns:100px 1fr 140px; align-items:center; gap:10px; margin:12px 0; }.status-row>div { height:12px; background:#0d1524; border-radius:10px; overflow:hidden; }.status-row i { display:block; height:100%; background:#8b7cf6; border-radius:10px; }.status-row strong { text-align:right; font-size:.82rem; }
.attention { border-color:#9f6230; }.attention>a { display:flex; justify-content:space-between; gap:12px; padding:13px; margin-top:8px; color:#fff; background:#3b2417; border-radius:8px; }.attention>a span { color:#ffd2a6; font-size:.78rem; }
.goal { display:grid; gap:12px; padding:16px 0; border-bottom:1px solid var(--border); }.goal h3 { margin:0; }.goal h3 small { color:var(--muted); }.goal label { display:grid; grid-template-columns:180px 1fr minmax(150px,auto); gap:12px; align-items:center; color:var(--muted); }.goal progress { width:100%; accent-color:#4c9aff; }
.export-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:12px; padding:18px 0; }.empty-analytics { padding:32px; text-align:center; color:var(--muted); }
.demo-tools { display:flex; flex-wrap:wrap; align-items:center; gap:12px; padding:14px 18px; margin-bottom:18px; border:1px dashed #9a7b2f; border-radius:12px; background:#302710; }.demo-tools span { color:#eadba9; margin-right:auto; }
.infrastructure-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:18px; margin-bottom:22px; }.infrastructure-card { min-height:210px; display:flex; flex-direction:column; align-items:flex-start; gap:14px; padding:22px; background:var(--surface); border:1px solid var(--border); border-radius:16px; box-shadow:0 10px 24px #0003; }.infrastructure-card h2 { margin-bottom:5px; }.infrastructure-card p,.infrastructure-card small { color:var(--muted); }.infra-status { margin-top:auto; padding:7px 11px; border-radius:999px; font-size:.78rem; font-weight:900; }.infra-configured { background:#14532d;color:#bbf7d0 }.infra-pending,.infra-unknown { background:#543b08;color:#fde68a }.infra-error { background:#5f1b1b;color:#fecaca }
@media(max-width:1150px){.kpi-grid{grid-template-columns:repeat(2,1fr)}.analytics-filters{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.kpi-grid,.analytics-grid,.analytics-filters{grid-template-columns:1fr}.status-row{grid-template-columns:90px 1fr}.status-row strong{grid-column:1/-1;text-align:left}.goal label{grid-template-columns:1fr}.analytics-table{min-width:760px}}
.readiness-card { padding:26px; margin-bottom:18px; border:2px solid; border-radius:18px; background:var(--surface); }.readiness-card>div { display:flex; justify-content:space-between; align-items:center; gap:20px; }.readiness-card strong { font-size:3.4rem; }.readiness-card span { font-weight:900; letter-spacing:.08em; }.readiness-card progress,.publishing-section>progress { width:100%; height:20px; }.readiness-red{border-color:#ef4444}.readiness-red progress{accent-color:#ef4444}.readiness-yellow{border-color:#eab308}.readiness-yellow progress{accent-color:#eab308}.readiness-green{border-color:#22c55e}.readiness-green progress{accent-color:#22c55e}.publishing-actions{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:20px}.publishing-sections{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.publishing-section{padding:22px}.publishing-section>header{display:flex;justify-content:space-between;gap:14px}.publishing-section>header span{color:var(--muted);font-size:.85rem}.publishing-section>header>strong{font-size:1.7rem}.validation-row{display:grid;grid-template-columns:34px 1fr auto;gap:12px;padding:14px 0;border-bottom:1px solid var(--border);align-items:start}.validation-row p,.validation-row small{margin:3px 0;color:var(--muted)}.validation-row>b{font-size:.72rem}.validation-icon{width:30px;height:30px;display:grid;place-items:center;border-radius:50%;font-weight:900}.validation-ok .validation-icon{background:#14532d;color:#bbf7d0}.validation-warning .validation-icon{background:#543b08;color:#fde68a}.validation-error .validation-icon,.validation-critical .validation-icon{background:#5f1b1b;color:#fecaca}.validation-critical{border-left:3px solid #ef4444;padding-left:10px}@media(max-width:900px){.publishing-sections{grid-template-columns:1fr}}