/* theme-dark.css - Dark mode for MocTel Secure Share */

/* === Base === */
body { background: #111827; color: #e5e7eb; }

/* === Header === */
.site-header { border-bottom-color: #1f2937; }
.site-logo { color: #60a5fa; }
.lang-toggle { color: #9ca3af; border-color: #374151; }
.lang-toggle:hover { background: #1f2937; }
.theme-select { background: #1f2937; color: #d1d5db; border-color: #374151; }
.theme-select option { background: #1f2937; color: #d1d5db; }

/* === Typography === */
h1 { color: #f3f4f6; }
h2 { color: #e5e7eb; }
h3 { color: #d1d5db; }
.text-muted { color: #9ca3af; }

/* === Cards === */
.card { background: #1f2937; border-color: #374151; }
.card-error { background: #1c1317; border-color: #7f1d1d; }
.card-muted { background: #1a2030; }

/* === Alerts === */
.alert-error { background: #1c1317; color: #fca5a5; border-color: #7f1d1d; }
.alert-warn { background: #1c1a10; color: #fcd34d; border-color: #92400e; }

/* === Forms === */
.form-group label { color: #d1d5db; }
input[type="text"], input[type="email"], input[type="tel"], input[type="url"],
input[type="number"], input[type="password"], input[type="datetime-local"],
textarea, select {
    background: #111827; border-color: #374151; color: #e5e7eb;
}
input:focus, textarea:focus, select:focus {
    border-color: #60a5fa; box-shadow: 0 0 0 3px rgba(96,165,250,0.15);
}

/* === Buttons === */
.btn, input[type="submit"], button { background: #2563eb; }
.btn:hover, .btn-primary:hover, input[type="submit"]:hover, button:hover { background: #1d4ed8; }
.btn-skip { color: #9ca3af !important; }
.btn-skip:hover { color: #60a5fa !important; }
.btn-back { color: #9ca3af !important; border-color: #374151 !important; }
.btn-back:hover { background: #1f2937 !important; color: #e5e7eb !important; border-color: #4b5563 !important; }

/* === Options === */
.option-label:hover { background: #1f2937; }
.error { color: #fca5a5; }
.success { color: #6ee7b7; }

/* === Content display === */
.frame { background: #1a2030; border-color: #374151; }
.watermarked-content { border-color: #374151; }
.watermarked-content::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100'%3E%3Ctext transform='translate(50 90) rotate(-45)' text-anchor='middle' font-family='Arial,sans-serif' font-size='12' fill='rgba(255,100,100,0.06)'%3Econfidential%3C/text%3E%3C/svg%3E");
}
pre { background: #111827; border-color: #374151; color: #e5e7eb; }

/* === Files / Details === */
details { border-color: #374151; }
summary { background: #1a2030; }
summary:hover { background: #1f2937; }
details[open] > summary { border-bottom-color: #374151; }
.download-right button { background: #2563eb; }
.file-hash { color: #6b7280; }

/* === Drop zone === */
.drop-zone { background: #1a2030; border-color: #374151; }
.drop-zone:hover { border-color: #60a5fa; background: #172038; }
.drop-zone.dragover { background: #172038; border-color: #60a5fa; }

/* === File list === */
.file-item { background: #1f2937; border-color: #374151; }

/* === Logs === */
.logs { color: #9ca3af; }
.log-entry { border-bottom-color: #1f2937; }
.log-action { color: #e5e7eb; }
.log-time, .log-ip { color: #6b7280; }
.log-detail { color: #9ca3af; }

/* === Toast === */
.toast { background: #059669; }

/* === Countdown === */
#countdown, #expiry-countdown { color: #f87171; }

/* === Puzzle === */
#puzzle { background-color: #0f172a; border-color: #374151; }
.tile { color: rgba(255,255,255,0.7); }
.tile.movable { background-color: rgba(96,165,250,0.12); }
.puzzle-bubble { background: #e5e7eb; color: #111827; }
.puzzle-bubble::after { border-top-color: #e5e7eb; }

/* === Password styles === */
.pw-style-option { border-color: #374151; }
.pw-style-option:hover { background: #1f2937; border-color: #4b5563; }
.pw-style-option.active { border-color: #60a5fa; background: #172038; }
.pw-style-name { color: #e5e7eb; }
.pw-style-desc { color: #6b7280; }
.pw-preview-label { color: #6b7280; }
.pw-example code { background: #111827; border-color: #374151; color: #6b7280; }
.pw-case-toggle { color: #9ca3af; border-top-color: #374151; }

/* === PIN entry === */
.pin-input { color: #f3f4f6 !important; border-color: #4b5563 !important; background: #1f2937 !important; caret-color: #60a5fa; }
.pin-input:focus { border-color: #60a5fa !important; box-shadow: 0 0 0 3px rgba(96,165,250,0.2) !important; }
.pin-entry.shake .pin-input { border-color: #f87171 !important; }

/* === Retrieve info === */
.retrieve-info-card { background: #1a2030; border-color: #374151; }
.retrieve-info-item { background: #1f2937; border-color: #374151; }
.retrieve-info-value { color: #f3f4f6; }
.retrieve-info-sub { color: #6b7280; }
.single-use-banner { background: #1c1317; border-color: #7f1d1d; }
.single-use-text { color: #d1d5db; }
.single-use-text strong { color: #f87171; }

/* === Mode toggle === */
.mode-toggle { border-color: #374151; }
.mode-btn { background: #1f2937 !important; color: #9ca3af !important; }
.mode-btn:hover { background: #374151 !important; }
.mode-btn.active { background: #2563eb !important; color: #fff !important; }

/* === Wizard progress === */
.wizard-progress::before { background: #374151; }
.wiz-num { background: #374151; border-color: #111827; }
.wiz-step.active .wiz-num { background: #2563eb; box-shadow: 0 0 0 4px rgba(37,99,235,0.2); }
.wiz-step.active .wiz-label { color: #60a5fa; }
.wiz-step.done .wiz-num { background: #059669; }
.wiz-step.done .wiz-label { color: #9ca3af; }
.wiz-step.done:hover .wiz-num { box-shadow: 0 0 0 4px rgba(5,150,105,0.2); }
.wiz-step.skipped .wiz-num { background: #4b5563; }
.wiz-step.skipped .wiz-label { color: #6b7280; }
.wiz-step:not(.active):not(.done) .wiz-num { background: #374151; }
.wiz-step:not(.active):not(.done) .wiz-label { color: #4b5563; }
.step-warn-dot { background: #ef4444; border-color: #111827; }
.wiz-label { color: #6b7280; }

/* === Option cards === */
.option-card { border-color: #374151; }
.option-card:hover { background: #1f2937; border-color: #4b5563; }
.option-card:has(> input:checked),
.option-card:has(> input:checked ~ .option-card-body) {
    border-color: #60a5fa; background: #172038;
}

/* === Preview mockups === */
.preview-screen { background: #1a2030; border-color: #374151; color: #9ca3af; }
.preview-header { color: #e5e7eb; }
.preview-text { color: #9ca3af; }
.preview-text-sm { color: #6b7280; }
.preview-input { background: #111827; border-color: #374151; color: #6b7280; }
.preview-btn { background: #2563eb; }
.preview-countdown { background: #1f2937; color: #6b7280; }
.preview-countdown-active { color: #f87171; background: #1c1317; }
.preview-after { border-top-color: #374151; color: #6b7280; }
.pin-dot { border-color: #4b5563; background: #1f2937; color: #e5e7eb; }
.preview-mini-form { background: #1a2030; border-color: #374151; }
.preview-label { color: #9ca3af; }
.preview-mini-logs { background: #1a2030; border-color: #374151; color: #9ca3af; }
.pp-tile { background: #374151; color: #9ca3af; }
.pp-empty { background: #1f2937; }

/* === Puzzle config / gallery === */
.puzzle-config { background: #1a2030; border-color: #374151; }
.puzzle-thumb:hover { border-color: #4b5563; }
.puzzle-thumb.selected { border-color: #60a5fa; box-shadow: 0 0 0 2px rgba(96,165,250,0.2); }

/* === Modal === */
.modal-box { background: #1f2937; }
.modal-header { border-bottom-color: #374151; }
.modal-close { color: #9ca3af; }
.modal-close-lg { background: #374151 !important; color: #d1d5db; }
.modal-close-lg:hover { background: #4b5563 !important; color: #f3f4f6; }

/* === Success page === */
.success-hero h1 { color: #f3f4f6; }
.success-subtitle { color: #cbd5e1; }
.success-subtitle strong { color: #f3f4f6; }
.next-steps-title { color: #f3f4f6; }
.success-share-card { background: #172038; border-color: #2563eb; }
.success-label { color: #d1d5db; }
.success-link-box { background: #1f2937; border-color: #374151; }
.success-link-box:hover { border-color: #60a5fa; box-shadow: 0 0 0 3px rgba(96,165,250,0.15); }
.success-link-input { color: #60a5fa; }
.success-copy-hint { color: #6b7280; }
.success-auth { border-top-color: #374151; }
.success-auth-label { color: #d1d5db; }
.success-auth-value { background: #1f2937; border-color: #374151; }
.success-auth-value:hover { border-color: #60a5fa; box-shadow: 0 0 0 3px rgba(96,165,250,0.15); }
.success-auth-input { color: #f3f4f6; }
.pin-digit { background: #1f2937; border-color: #4b5563; color: #f3f4f6; }
.success-pin-display:hover .pin-digit { border-color: #60a5fa; }
.success-details { border-top-color: #374151; color: #9ca3af; }

/* === Instructions === */
.success-instructions-card { background: #1a2030; border-color: #374151; }
.instr-preview { background: #1f2937; border-color: #374151; }
.instr-line { color: #d1d5db; border-bottom-color: #374151; }
.instr-line:hover { background: #1a2030; }
.instr-line.active::before { color: #6ee7b7; }
.instr-line.excluded { background: #111827; color: #4b5563; text-decoration-color: #374151; }
.instr-line.excluded:hover { background: #1a2030; color: #6b7280; }

/* === Monitor === */
.monitor-details { border-color: #374151; }
.monitor-summary { color: #6b7280; background: #1a2030; }
.monitor-summary:hover { background: #1f2937; }

/* === Expiry chips === */
.expiry-chip { background: #1f2937 !important; color: #9ca3af !important; border-color: #374151 !important; }
.expiry-chip:hover { background: #374151 !important; border-color: #4b5563 !important; }
.expiry-chip.active { background: #2563eb !important; color: #fff !important; border-color: #2563eb !important; }
.expiry-preview { color: #9ca3af; }
.expiry-preview strong { color: #60a5fa; }

/* === Date/time picker === */
.dt-calendar { background: #1f2937; border-color: #374151; }
.dt-cal-title { color: #e5e7eb; }
.dt-cal-nav { color: #9ca3af !important; }
.dt-cal-nav:hover { background: #374151 !important; }
.dt-cal-weekdays { color: #6b7280; }
.dt-day { color: #d1d5db; }
.dt-day:hover { background: #374151; }
.dt-day.selected { background: #2563eb; color: #fff; }
.dt-day.today { border-color: #60a5fa; }
.dt-day.disabled { color: #374151; }
.dt-day.other-month { color: #374151; }
.dt-time-label { color: #9ca3af; }
.dt-colon { color: #6b7280; }
.dt-spin-btn { background: #374151 !important; border-color: #4b5563 !important; color: #9ca3af !important; }
.dt-spin-btn:hover { background: #4b5563 !important; }
.dt-spin-val { background: #1f2937 !important; border-color: #4b5563 !important; color: #e5e7eb; }

/* === Demo === */
.demo-hint { color: #6b7280; }
.demo-target::before { border-color: rgba(96,165,250,0.6); }

/* === Upload progress === */
.upload-progress-box { background: #1f2937; }
.upload-progress-title { color: #f3f4f6; }
.upload-progress-bar-wrap { background: #374151; }
.upload-progress-pct { color: #60a5fa; }
.upload-progress-stats { color: #6b7280; }

/* === "Disable this document" danger card === */
.drop-disable-card { background: #2a1414; border-color: #5b2a2a; }
.drop-disable-card h3 { color: #f5a5a5; }

/* === Reverse-share home CTA === */
.inbox-cta { background: #15233a; border-color: #29415f; color: #93c5fd; }
.inbox-cta:hover { background: #1b2c47; border-color: #3b82f6; }
.inbox-cta:visited, .inbox-cta strong { color: #93c5fd; }

/* === Scrollbar === */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #111827; }
::-webkit-scrollbar-thumb { background: #374151; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #4b5563; }
