/**
 * EOCRM CMS visual languages.
 *
 * The selected crm_style is intentionally shared by every authenticated CMS
 * screen. CRM-specific WordPress parity remains in crm-wordpress-styles.css;
 * this file owns the application shell, forms, tables, settings and auth UI.
 */

.cms-style-estate,
.cms-style-modern,
.cms-style-minimal {
    --primary: var(--brand);
    --primary-soft: var(--brand-soft);
    --border: var(--line);
    --text: var(--ink);
    --surface-muted: var(--surface-soft);
}

/* Estate Office — default, derived from the estateofficecrm.pl brand system. */
.cms-style-estate {
    --bg: #f6f2ea;
    --surface: rgba(255,255,255,.88);
    --surface-soft: #fdf9f3;
    --surface-strong: #fff;
    --ink: #12161b;
    --muted: #5d6470;
    --line: rgba(18,22,27,.11);
    --brand: #0c5ec8;
    --blue: var(--brand);
    --brand-dark: #0e347c;
    --brand-soft: #e8f1fc;
    --success: #4f8a10;
    --success-soft: #eff7dc;
    --sidebar: #0a1b34;
    --sidebar-soft: #0d2c5d;
    --shadow: 0 20px 50px rgba(14,30,54,.12);
    --shadow-sm: 0 16px 40px rgba(14,30,54,.08);
    --radius: 24px;
    --radius-sm: 16px;
}

.cms-style-estate.app-body,
.cms-style-estate.auth-body,
.cms-style-estate.installer-body {
    background:
        radial-gradient(circle at 0 0, rgba(12,94,200,.12), transparent 34%),
        radial-gradient(circle at 94% 10%, rgba(199,232,74,.20), transparent 25%),
        linear-gradient(180deg,#faf6ef 0%,#f6f2ea 48%,#f9f5ed 100%);
}
.cms-style-estate .app-sidebar {
    background:
        radial-gradient(circle at 22% 0, rgba(12,94,200,.56), transparent 29%),
        radial-gradient(circle at 100% 100%, rgba(127,181,26,.18), transparent 31%),
        linear-gradient(180deg,#0d2c5d 0%,#0a1b34 100%);
}
.cms-style-estate .sidebar-nav a { border: 1px solid transparent; border-radius: 14px; }
.cms-style-estate .sidebar-nav a .icon {
    width: 18px;
    height: 18px;
    padding: 6px;
    border: 1px solid rgba(199,232,74,.12);
    border-radius: 10px;
    background: linear-gradient(145deg,rgba(12,94,200,.32),rgba(127,181,26,.14));
    color: #d5e9ff;
    box-sizing: content-box;
}
.cms-style-estate .sidebar-nav a.is-active {
    border-color: rgba(199,232,74,.26);
    background: linear-gradient(135deg,rgba(12,94,200,.88),rgba(14,52,124,.82));
    box-shadow: inset 3px 0 0 #c7e84a, 0 12px 26px rgba(2,16,38,.18);
}
.cms-style-estate .sidebar-nav a.is-active .icon {
    border-color: rgba(255,255,255,.34);
    background: linear-gradient(145deg,#fff,#dff68d);
    color: #0e347c;
    box-shadow: 0 6px 14px rgba(2,16,38,.18);
}
.cms-style-estate .sidebar-nav a em { background: rgba(199,232,74,.16); color: #dff68d; }
.cms-style-estate .sidebar-scroll-region { scrollbar-color: rgba(199,232,74,.48) transparent; }
.cms-style-estate .sidebar-scroll-region::-webkit-scrollbar-thumb { background-color: rgba(199,232,74,.48); }
.cms-style-estate .construction-quick-control > a .icon { color: #dff68d; }
.cms-style-estate .workspace-chip { border-color: rgba(255,255,255,.13); border-radius: 16px; background: rgba(255,255,255,.075); }
.cms-style-estate .workspace-avatar,
.cms-style-estate .user-avatar { border-radius: 12px; background: linear-gradient(135deg,#0c5ec8,#7fb51a); }
.cms-style-estate .app-topbar {
    border-color: rgba(18,22,27,.09);
    background: color-mix(in srgb,#fff 80%,transparent);
    box-shadow: 0 10px 34px rgba(14,30,54,.045);
}
.cms-style-estate .app-content { position: relative; }
.cms-style-estate .page-heading h1 { color: #12161b; letter-spacing: -.04em; }
.cms-style-estate .eyebrow-chip { background: #e8f1fc; color: #0e347c; }
.cms-style-estate .panel-card,
.cms-style-estate .metric-card,
.cms-style-estate .notification-popover {
    border-color: rgba(18,22,27,.10);
    background: linear-gradient(180deg,rgba(255,255,255,.94),rgba(255,255,255,.78));
    box-shadow: 0 16px 40px rgba(14,30,54,.08);
}
.cms-style-estate .panel-card { backdrop-filter: blur(9px); }
.cms-style-estate .panel-card::before {
    position: absolute;
    inset: 0 26px auto;
    height: 2px;
    border-radius: 0 0 4px 4px;
    background: linear-gradient(90deg,#0c5ec8,#7fb51a,#c7e84a);
    opacity: .78;
    content: "";
}
.cms-style-estate .check-table::before,
.cms-style-estate .crm-module-shell .panel-card::before { display: none; }
.cms-style-estate .button-primary {
    background: linear-gradient(135deg,#0c5ec8 0%,#0e347c 100%);
    box-shadow: 0 14px 28px rgba(12,94,200,.24);
}
.cms-style-estate .button-primary:hover { box-shadow: 0 18px 34px rgba(12,94,200,.32); }
.cms-style-estate .button-secondary { background: rgba(255,255,255,.76); }
.cms-style-estate .button-secondary:hover { border-color: rgba(12,94,200,.4); color: #0e347c; }
.cms-style-estate .field input,
.cms-style-estate .field textarea,
.cms-style-estate .field select,
.cms-style-estate .posts-filter-bar input,
.cms-style-estate .posts-filter-bar select {
    border-radius: 14px;
    background: rgba(255,255,255,.88);
}
.cms-style-estate .field input:focus,
.cms-style-estate .field textarea:focus,
.cms-style-estate .field select:focus { box-shadow: 0 0 0 4px rgba(12,94,200,.12); }
.cms-style-estate .posts-tabs,
.cms-style-estate .crm-settings-tabs,
.cms-style-estate .crm-primary-tabs { border-radius: 18px; background: rgba(255,255,255,.78); backdrop-filter: blur(8px); }
.cms-style-estate .posts-tabs a.is-active,
.cms-style-estate .crm-settings-tabs a.is-active {
    background: linear-gradient(135deg,#0c5ec8,#0e347c);
    color: #fff;
    box-shadow: 0 9px 20px rgba(12,94,200,.18);
}
.cms-style-estate .metric-card::after { background: linear-gradient(135deg,rgba(12,94,200,.16),rgba(199,232,74,.30)); }
.cms-style-estate .metric-card .metric-icon { background: linear-gradient(135deg,#e8f1fc,#eff7dc); color: #0e347c; }
.cms-style-estate .check-table-head,
.cms-style-estate .posts-table th { background: #fdf9f3; color: #5d6470; }
.cms-style-estate .posts-table tbody tr:hover,
.cms-style-estate .check-table-row:hover { background: rgba(199,232,74,.08); }
.cms-style-estate .auth-story,
.cms-style-estate .installer-intro {
    background:
        radial-gradient(circle at 90% 12%,rgba(199,232,74,.28),transparent 28%),
        radial-gradient(circle at 4% 94%,rgba(12,94,200,.38),transparent 36%),
        linear-gradient(145deg,#0a1b34,#0e347c);
}
.cms-style-estate .auth-feature-list .icon { color: #c7e84a; }
.cms-style-estate .auth-card { border-radius: 32px; background: rgba(255,255,255,.88); backdrop-filter: blur(12px); }
.cms-style-estate .install-check-card,
.cms-style-estate .install-form-card { border-radius: 24px; background: rgba(255,255,255,.88); }

/* Estate Office treatment inside CRM, while preserving its information model. */
.cms-style-estate .crm-module-shell {
    --eocrm-bg: #f6f2ea;
    --eocrm-card: rgba(255,255,255,.90);
    --eocrm-border: rgba(18,22,27,.11);
    --eocrm-border-strong: rgba(18,22,27,.18);
    --eocrm-text: #12161b;
    --eocrm-muted: #5d6470;
    --eocrm-primary: #0c5ec8;
    --eocrm-primary-dark: #0e347c;
    --eocrm-primary-soft: #e8f1fc;
    --eocrm-accent: #7fb51a;
    --eocrm-success: #4f8a10;
    --eocrm-success-soft: #eff7dc;
    --eocrm-radius-sm: 12px;
    --eocrm-radius: 18px;
    --eocrm-radius-lg: 24px;
    --eocrm-shadow-sm: 0 8px 24px rgba(14,30,54,.06);
    --eocrm-shadow: 0 16px 40px rgba(14,30,54,.08);
    background:
        radial-gradient(circle at 100% 0,rgba(199,232,74,.15),transparent 25%),
        linear-gradient(180deg,rgba(255,255,255,.68),rgba(246,242,234,.88));
    box-shadow: 0 20px 50px rgba(14,30,54,.08);
}
.cms-style-estate .crm-main-heading h1,
.cms-style-estate .crm-dashboard-hero h2 { color: #12161b; font-weight: 800; }
.cms-style-estate .crm-primary-tabs { border: 1px solid rgba(18,22,27,.1); padding: 7px; }
.cms-style-estate .crm-primary-tabs a.is-active {
    border-color: transparent;
    background: linear-gradient(135deg,#0c5ec8,#0e347c);
    color: #fff;
    box-shadow: 0 10px 22px rgba(12,94,200,.2);
}
.cms-style-estate .crm-dashboard-hero,
.cms-style-estate .crm-form-page-heading,
.cms-style-estate .crm-profile-hero {
    border-color: rgba(18,22,27,.1);
    border-radius: 24px;
    background: linear-gradient(135deg,rgba(255,255,255,.96),rgba(239,247,220,.64));
    box-shadow: 0 16px 40px rgba(14,30,54,.08);
}
.cms-style-estate .crm-dashboard-metrics .metric-card::after { background: linear-gradient(90deg,#0c5ec8,#7fb51a,#c7e84a); }
.cms-style-estate .crm-record-card:hover,
.cms-style-estate .crm-office-grid article:hover,
.cms-style-estate .crm-agent-grid article:hover { border-color: rgba(12,94,200,.35); box-shadow: 0 16px 38px rgba(14,30,54,.11); }
.cms-style-estate .crm-table th { background: #fdf9f3; color: #12161b; }
.cms-style-estate .crm-table tbody tr:hover { background: rgba(199,232,74,.08); }
.cms-style-estate .crm-form-section { border-radius: 24px; box-shadow: 0 16px 40px rgba(14,30,54,.08); }
.cms-style-estate .crm-form-section::before { background: linear-gradient(90deg,#0c5ec8,#7fb51a,#c7e84a); }

/* Modern — richer blue depth across every CMS module. */
.cms-style-modern {
    --bg: #f3f7fc;
    --surface: #fff;
    --surface-soft: #f7faff;
    --surface-strong: #eaf2ff;
    --ink: #14273d;
    --muted: #66778b;
    --line: #dfe8f3;
    --brand: #1168d9;
    --blue: var(--brand);
    --brand-dark: #0b4fa8;
    --brand-soft: #e9f2ff;
    --sidebar: #0d2848;
    --sidebar-soft: #14375f;
    --shadow: 0 18px 50px rgba(29,57,91,.09);
    --shadow-sm: 0 10px 24px rgba(29,57,91,.07);
    --radius: 20px;
    --radius-sm: 13px;
}
.cms-style-modern.app-body { background: radial-gradient(circle at 90% 0,rgba(49,136,238,.08),transparent 30%),#f3f7fc; }
.cms-style-modern .app-sidebar { background: radial-gradient(circle at 30% 0,#184675 0,transparent 30%),linear-gradient(180deg,#0d2848,#091d35); }
.cms-style-modern .sidebar-nav a.is-active { background: linear-gradient(135deg,rgba(50,135,238,.72),rgba(40,115,205,.42)); }
.cms-style-modern .sidebar-nav a .icon {
    width: 18px;
    height: 18px;
    padding: 5px;
    border: 1px solid rgba(111,180,255,.15);
    border-radius: 999px;
    background: linear-gradient(145deg,rgba(62,143,244,.22),rgba(108,76,245,.13));
    color: #a9d0ff;
    box-sizing: content-box;
}
.cms-style-modern .sidebar-nav a.is-active .icon {
    border-color: rgba(255,255,255,.28);
    background: linear-gradient(145deg,#438ff3,#6c4cf5);
    color: #fff;
    box-shadow: 0 6px 15px rgba(2,16,38,.22);
}
.cms-style-modern .sidebar-scroll-region { scrollbar-color: rgba(104,168,255,.52) transparent; }
.cms-style-modern .sidebar-scroll-region::-webkit-scrollbar-thumb { background-color: rgba(104,168,255,.52); }
.cms-style-modern .panel-card,
.cms-style-modern .metric-card { box-shadow: 0 10px 24px rgba(29,57,91,.07); }
.cms-style-modern .panel-card:hover { border-color: #cbdced; }
.cms-style-modern .posts-tabs a.is-active,
.cms-style-modern .crm-settings-tabs a.is-active { background: linear-gradient(135deg,#1168d9,#3188ee); color: #fff; }

/* Minimalistyczny — flat, compact and quiet across the whole CMS. */
.cms-style-minimal {
    --bg: #fafbfc;
    --surface: #fff;
    --surface-soft: #f5f6f7;
    --surface-strong: #eef1f3;
    --ink: #202936;
    --muted: #6d7580;
    --line: #dfe3e7;
    --brand: #2f3a4e;
    --blue: var(--brand);
    --brand-dark: #202936;
    --brand-soft: #e4ecf3;
    --sidebar: #202936;
    --sidebar-soft: #2f3a4e;
    --shadow: none;
    --shadow-sm: none;
    --radius: 10px;
    --radius-sm: 7px;
}
.cms-style-minimal .app-sidebar { background: #202936; }
.cms-style-minimal .workspace-chip { border-radius: 7px; background: rgba(255,255,255,.045); }
.cms-style-minimal .workspace-avatar,
.cms-style-minimal .user-avatar { border-radius: 6px; background: #5b687a; }
.cms-style-minimal .sidebar-nav a { min-height: 40px; border-radius: 6px; font-weight: 600; }
.cms-style-minimal .sidebar-nav a.is-active { background: rgba(255,255,255,.11); box-shadow: inset 3px 0 0 #b8c4cf; }
.cms-style-minimal .sidebar-nav a .icon {
    width: 18px;
    height: 18px;
    padding: 3px;
    border: 1px solid rgba(220,228,236,.2);
    border-radius: 5px;
    background: transparent;
    color: #c8d2dc;
    box-sizing: content-box;
    stroke-width: 1.55;
}
.cms-style-minimal .sidebar-nav a.is-active .icon { border-color: rgba(255,255,255,.38); background: rgba(255,255,255,.08); color: #fff; box-shadow: none; }
.cms-style-minimal .sidebar-scroll-region { scrollbar-color: #738096 transparent; }
.cms-style-minimal .sidebar-scroll-region::-webkit-scrollbar-thumb { border-radius: 3px; background-color: #738096; }
.cms-style-minimal .app-topbar { min-height: 66px; border-color: #dfe3e7; background: #fff; backdrop-filter: none; }
.cms-style-minimal .app-content { padding-top: 30px; }
.cms-style-minimal .page-heading h1 { font-weight: 700; letter-spacing: -.02em; }
.cms-style-minimal .eyebrow-chip { border-radius: 6px; background: #e4ecf3; color: #536579; }
.cms-style-minimal .panel-card,
.cms-style-minimal .metric-card,
.cms-style-minimal .notification-popover { border-radius: 10px; box-shadow: none; }
.cms-style-minimal .button { border-radius: 7px; font-weight: 600; box-shadow: none; transform: none; }
.cms-style-minimal .button:hover { box-shadow: none; transform: none; }
.cms-style-minimal .button-primary { background: #2f3a4e; }
.cms-style-minimal .field input,
.cms-style-minimal .field textarea,
.cms-style-minimal .field select,
.cms-style-minimal .posts-filter-bar input,
.cms-style-minimal .posts-filter-bar select { border-radius: 6px; box-shadow: none; }
.cms-style-minimal .posts-tabs,
.cms-style-minimal .crm-settings-tabs { padding: 0; border: 0; border-bottom: 1px solid #dfe3e7; border-radius: 0; background: transparent; box-shadow: none; }
.cms-style-minimal .posts-tabs a,
.cms-style-minimal .crm-settings-tabs a { border-radius: 0; border-bottom: 2px solid transparent; }
.cms-style-minimal .posts-tabs a.is-active,
.cms-style-minimal .crm-settings-tabs a.is-active { border-bottom-color: #2f3a4e; background: transparent; color: #202936; }
.cms-style-minimal .metric-card::after { display: none; }
.cms-style-minimal .check-table-head,
.cms-style-minimal .posts-table th { background: #f5f6f7; }
.cms-style-minimal .auth-story,
.cms-style-minimal .installer-intro { background: #202936; }
.cms-style-minimal .auth-card,
.cms-style-minimal .install-check-card,
.cms-style-minimal .install-form-card { border-radius: 10px; box-shadow: none; }

/* Three self-explanatory previews in Settings. */
.crm-visual-style-option.is-estate .crm-visual-style-preview {
    border-color: rgba(18,22,27,.12);
    border-radius: 14px;
    background: linear-gradient(160deg,#fff,#f6f2ea);
    box-shadow: 0 8px 18px rgba(14,30,54,.10);
}
.crm-visual-style-option.is-estate .crm-visual-style-preview i:nth-child(1) { background: linear-gradient(180deg,#0e347c,#0a1b34); }
.crm-visual-style-option.is-estate .crm-visual-style-preview i:nth-child(2) { background: linear-gradient(90deg,#0c5ec8,#c7e84a); }
.crm-visual-style-option.is-estate .crm-visual-style-preview i:nth-child(3) { background: #eff7dc; }
.crm-visual-style-option.is-estate .crm-visual-style-preview i:nth-child(4) { background: #e8f1fc; }
.crm-visual-style-option.is-estate .crm-visual-style-preview i:nth-child(5) { background: #f0ebe2; }

/* Dark mode keeps contrast while retaining each style's geometry. */
html[data-theme="dark"] .cms-style-estate,
html[data-theme="dark"] .cms-style-modern,
html[data-theme="dark"] .cms-style-minimal {
    --bg: #0c1828;
    --surface: #14253a;
    --surface-soft: #172b43;
    --surface-strong: #1c3552;
    --ink: #edf5ff;
    --muted: #9db0c7;
    --line: #28425f;
    --brand: #68a8ff;
    --blue: var(--brand);
    --brand-dark: #98c4ff;
    --brand-soft: #18385f;
    --shadow: 0 18px 50px rgba(0,0,0,.22);
    --shadow-sm: 0 10px 24px rgba(0,0,0,.17);
}
html[data-theme="dark"] .cms-style-estate.app-body,
html[data-theme="dark"] .cms-style-modern.app-body,
html[data-theme="dark"] .cms-style-minimal.app-body { background: #0c1828; }
html[data-theme="dark"] .cms-style-estate .app-topbar,
html[data-theme="dark"] .cms-style-estate .panel-card,
html[data-theme="dark"] .cms-style-estate .metric-card,
html[data-theme="dark"] .cms-style-estate .notification-popover { background: #14253a; }
html[data-theme="dark"] .cms-style-estate .page-heading h1,
html[data-theme="dark"] .cms-style-estate .crm-main-heading h1,
html[data-theme="dark"] .cms-style-estate .crm-dashboard-hero h2 { color: #edf5ff; }
html[data-theme="dark"] .cms-style-estate .crm-module-shell {
    --eocrm-card: #14253a;
    --eocrm-bg: #101f31;
    --eocrm-border: #28425f;
    --eocrm-border-strong: #385675;
    --eocrm-text: #edf5ff;
    --eocrm-muted: #9db0c7;
    --eocrm-primary: #68a8ff;
    --eocrm-primary-dark: #98c4ff;
    --eocrm-primary-soft: #18385f;
    background: #101f31;
}

@media (max-width: 760px) {
    .cms-style-estate .panel-card::before { inset-inline: 18px; }
    .cms-style-estate .auth-card { border-radius: 22px; }
}

@media (prefers-reduced-motion: reduce) {
    .cms-style-estate .panel-card,
    .cms-style-modern .panel-card,
    .cms-style-minimal .panel-card { transition: none !important; }
}
