/*
 * Silahadir P12-V3A — Home & Explorer Flat Rows
 * Scope: index.php desktop-window shell only.
 * Contract: visual-only; no form, route, data-attribute, JS hook, or theme renderer changes.
 */

.os-window .window-body {
    --p12-flat-line: rgba(255, 255, 255, .12);
    --p12-flat-line-strong: rgba(255, 255, 255, .19);
    --p12-flat-hover: rgba(125, 211, 252, .065);
    --p12-flat-selected: rgba(96, 165, 250, .11);
}

/* One window = one surface. Ordinary headings/content no longer need another card. */
.os-window .window-body .info-card {
    margin: 0 0 14px !important;
    padding: 3px 2px 18px !important;
    overflow: visible !important;
    border: 0 !important;
    border-bottom: 1px solid var(--p12-flat-line) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.os-window .window-body .info-card:last-child {
    margin-bottom: 0 !important;
}

.os-window .window-body .info-card h2,
.os-window .window-body .info-card h3 {
    margin-top: 0 !important;
}

.os-window .window-body .home-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 0 !important;
}

/* Statistics become a calm strip with dividers rather than four nested cards. */
.os-window .window-body .stat-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 0 !important;
    margin: 18px 0 4px !important;
    border-top: 1px solid var(--p12-flat-line) !important;
    border-bottom: 1px solid var(--p12-flat-line) !important;
}

.os-window .window-body .stat-card {
    min-width: 0 !important;
    padding: 14px 13px !important;
    border: 0 !important;
    border-right: 1px solid var(--p12-flat-line) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.os-window .window-body .stat-card:last-child {
    border-right: 0 !important;
}

.os-window .window-body .stat-card strong {
    font-size: clamp(22px, 3vw, 30px) !important;
}

/* Storage and settings are rows. Progress, choices, and actions remain interactive. */
.os-window .window-body .drive-grid,
.os-window .window-body .settings-grid,
.os-window .window-body .category-grid {
    display: block !important;
    margin-top: 0 !important;
}

.os-window .window-body .drive-card,
.os-window .window-body .setting-card,
.os-window .window-body .category-card {
    position: relative !important;
    margin: 0 !important;
    padding: 16px 5px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--p12-flat-line) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    transition: background-color .16s ease, border-color .16s ease !important;
}

.os-window .window-body .drive-card:first-child,
.os-window .window-body .setting-card:first-child,
.os-window .window-body .category-card:first-child {
    border-top: 1px solid var(--p12-flat-line) !important;
}

.os-window .window-body .drive-card:hover,
.os-window .window-body .setting-card:hover,
.os-window .window-body .category-card:hover {
    border-color: var(--p12-flat-line-strong) !important;
    background: var(--p12-flat-hover) !important;
    transform: none !important;
}

.os-window .window-body .drive-card h3,
.os-window .window-body .setting-card h3,
.os-window .window-body .category-card h3 {
    margin: 0 0 5px !important;
}

.os-window .window-body .drive-card p,
.os-window .window-body .setting-card p,
.os-window .window-body .category-card p {
    margin-top: 5px !important;
    margin-bottom: 9px !important;
}

.os-window .window-body .drive-card .drive-bar {
    height: 5px !important;
    margin-top: 11px !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, .08) !important;
    box-shadow: none !important;
}

.os-window .window-body .category-card .folder-icon {
    width: 34px !important;
    height: 34px !important;
    margin: 0 0 7px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: 24px !important;
}

/* Explorer details: true list rows, one divider, very light hover. */
.os-window .window-body .category-details-toolbar {
    margin: 0 !important;
    padding: 8px 4px 11px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--p12-flat-line-strong) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.os-window .window-body .category-details-view {
    display: grid !important;
    gap: 0 !important;
}

.os-window .window-body .category-detail-row {
    padding: 11px 5px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--p12-flat-line) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    transition: background-color .15s ease, box-shadow .15s ease !important;
}

.os-window .window-body .category-detail-row:hover {
    border-color: var(--p12-flat-line) !important;
    background: var(--p12-flat-hover) !important;
    transform: none !important;
}

.os-window .window-body .category-detail-row.is-selected {
    border-color: var(--p12-flat-line) !important;
    background: var(--p12-flat-selected) !important;
    box-shadow: inset 2px 0 0 rgba(125, 211, 252, .78) !important;
}

.os-window .window-body .category-detail-row .folder-detail-icon {
    width: 32px !important;
    height: 32px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: inherit !important;
    font-size: 20px !important;
}

/* Template preview remains a real item boundary, but the outer card becomes quiet. */
.os-window .window-body .template-explorer-head {
    margin-bottom: 15px !important;
}

.os-window .window-body .template-total-pill {
    display: inline-flex !important;
    width: auto !important;
    margin-top: 9px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: var(--muted) !important;
}

.os-window .window-body .template-explorer-shell .template-card.template-card-clean,
.os-window .window-body .template-explorer-shell .template-card {
    border: 1px solid transparent !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    transition: background-color .16s ease, border-color .16s ease !important;
}

.os-window .window-body .template-explorer-shell .template-card.template-card-clean:hover,
.os-window .window-body .template-explorer-shell .template-card:hover {
    border-color: var(--p12-flat-line) !important;
    background: var(--p12-flat-hover) !important;
    box-shadow: none !important;
    transform: none !important;
}

.os-window .window-body .template-explorer-shell .template-card-clean .template-preview,
.os-window .window-body .template-explorer-shell .template-card .template-preview {
    border: 1px solid var(--p12-flat-line) !important;
    border-radius: 10px !important;
    box-shadow: none !important;
}

.os-window .window-body .template-explorer-shell .template-card-clean:hover .template-preview img,
.os-window .window-body .template-explorer-shell .template-card:hover .template-preview img {
    transform: scale(1.015) !important;
}

.os-window .window-body .template-explorer-shell .template-card-clean .template-content,
.os-window .window-body .template-explorer-shell .template-card .template-content {
    padding-left: 2px !important;
    padding-right: 2px !important;
}

/* Nested scanner rows follow the same flat rhythm; the table keeps its own boundary. */
.os-window .window-body .scanner-list span {
    padding: 8px 2px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--p12-flat-line) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.os-window .window-body .scanner-table-card {
    padding-bottom: 10px !important;
}

/* Desktop shortcuts keep identity, but emoji/icons no longer sit inside mini cards. */
.desktop-icon > .icon-box:not(.silahadir-home-icon) {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: 29px !important;
}

.desktop-icon:hover,
.desktop-icon:focus-visible {
    outline: 1px solid rgba(255, 255, 255, .15) !important;
    background: rgba(255, 255, 255, .075) !important;
}

/* P12-V3ARR4 — drag transform must remain owned by app-silahadir-v40.js. */
.desktop-icon.is-dragging {
    transition: none !important;
    will-change: transform;
}
.desktop-icon.cuuzz-back {
    will-change: transform;
}

@media (max-width: 760px) {
    .os-window .window-body .stat-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .os-window .window-body .stat-card:nth-child(2) {
        border-right: 0 !important;
    }

    .os-window .window-body .stat-card:nth-child(-n + 2) {
        border-bottom: 1px solid var(--p12-flat-line) !important;
    }

    .os-window .window-body .info-card,
    .os-window .window-body .template-explorer-head {
        padding: 2px 1px 15px !important;
    }

    .os-window .window-body .drive-card,
    .os-window .window-body .setting-card,
    .os-window .window-body .category-card {
        padding: 14px 3px !important;
    }

    .os-window .window-body .category-detail-row {
        padding: 12px 3px !important;
    }

    .os-window .window-body .template-explorer-shell .template-card.template-card-clean,
    .os-window .window-body .template-explorer-shell .template-card {
        padding: 0 0 10px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .desktop-icon,
    .os-window .window-body .drive-card,
    .os-window .window-body .setting-card,
    .os-window .window-body .category-card,
    .os-window .window-body .category-detail-row,
    .os-window .window-body .template-card,
    .os-window .window-body .template-preview img {
        transition: none !important;
    }
}

/*
 * P12-V3AR — Home/About Micro Cleanup
 * Scope: compact Home actions and remove extra About navigation weight.
 * Contract: no route, data attribute, window runtime, or invitation logic changes.
 */
.os-window .window-body .home-main-actions {
    display: flex !important;
    width: min(100%, 430px) !important;
    max-width: 430px !important;
    align-items: stretch !important;
    gap: 8px !important;
    margin-top: 16px !important;
}

.os-window .window-body .home-main-actions > a {
    flex: 0 1 190px !important;
    width: auto !important;
    min-width: 0 !important;
    min-height: 36px !important;
    padding: 7px 16px !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    transform: none !important;
}

.os-window .window-body .home-main-actions > a:hover,
.os-window .window-body .home-main-actions > a:focus-visible {
    transform: none !important;
    box-shadow: none !important;
}

.os-window .window-body .about-actions {
    display: flex !important;
    width: auto !important;
    margin-top: 15px !important;
}

.os-window .window-body .about-actions .about-privacy-link {
    width: auto !important;
    min-width: 0 !important;
    min-height: 34px !important;
    padding: 6px 14px !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    transform: none !important;
}

@media (max-width: 520px) {
    .os-window .window-body .home-main-actions {
        width: 100% !important;
        max-width: none !important;
    }

    .os-window .window-body .home-main-actions > a {
        flex: 1 1 0 !important;
        min-height: 36px !important;
        padding-inline: 10px !important;
        font-size: 12px !important;
    }
}



/*
 * P12-V3ARR — Home/Control Visibility & Accent Recovery
 * Scope: Home action corners and Control Panel choices only.
 * Contract: no route, window runtime, invitation data, or theme renderer changes.
 */
.os-window .window-body .home-grid .info-card:first-child .detail-actions.home-main-actions > a,
.os-window .window-body .home-main-actions > .dashboard-spotlight-btn,
.os-window .window-body .home-main-actions > .create-main-btn {
    border-radius: 0 !important;
    -webkit-border-radius: 0 !important;
    clip-path: inset(0) !important;
}

/* Neutral flat choices stay readable before hover. */
.os-window .window-body .control-choice-row,
.os-window .window-body .visitor-action-row {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}

.os-window .window-body .control-choice-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-width: 112px !important;
    min-height: 34px !important;
    padding: 7px 13px !important;
    border: 1px solid var(--p12-flat-line-strong) !important;
    border-radius: 0 !important;
    background: rgba(255, 255, 255, .055) !important;
    color: var(--text) !important;
    box-shadow: none !important;
    text-decoration: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    text-indent: 0 !important;
    transform: none !important;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease !important;
}

.os-window .window-body .control-choice-btn:hover,
.os-window .window-body .control-choice-btn:focus-visible {
    background: var(--p12-flat-hover) !important;
    border-color: rgba(125, 211, 252, .42) !important;
    color: #fff !important;
    transform: none !important;
}

html[data-lang="id"] .os-window .window-body [data-lang-choice="id"],
html[data-lang="en"] .os-window .window-body [data-lang-choice="en"] {
    border-color: var(--accent) !important;
    background: color-mix(in srgb, var(--accent) 22%, transparent) !important;
    color: #fff !important;
    box-shadow: inset 3px 0 0 var(--accent) !important;
}

.os-window .window-body .control-studio-link {
    border-color: color-mix(in srgb, var(--accent) 58%, transparent) !important;
    background: color-mix(in srgb, var(--accent) 15%, transparent) !important;
}

/* Restore the four desktop accent previews removed by the old global flat rule. */
.os-window .window-body .theme-options {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(52px, 1fr)) !important;
    width: min(100%, 360px) !important;
    gap: 8px !important;
    margin-top: 12px !important;
}

.os-window .window-body .theme-options .theme-choice-swatch {
    width: 100% !important;
    height: 34px !important;
    min-height: 34px !important;
    padding: 0 !important;
    border: 1px solid rgba(255, 255, 255, .24) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
}

.os-window .window-body .theme-options .theme-aurora {
    background-color: #142540 !important;
    background-image: linear-gradient(135deg, #38bdf8 0%, #a78bfa 50%, #fb7185 100%) !important;
}
.os-window .window-body .theme-options .theme-forest {
    background-color: #14352e !important;
    background-image: linear-gradient(135deg, #34d399 0%, #0f766e 58%, #facc15 100%) !important;
}
.os-window .window-body .theme-options .theme-rose {
    background-color: #3b1430 !important;
    background-image: linear-gradient(135deg, #f472b6 0%, #db2777 58%, #fbbf24 100%) !important;
}
.os-window .window-body .theme-options .theme-navy {
    background-color: #172554 !important;
    background-image: linear-gradient(135deg, #3b82f6 0%, #172554 58%, #0ea5e9 100%) !important;
}

body[data-theme="aurora"] .os-window .window-body .theme-aurora,
body[data-theme="forest"] .os-window .window-body .theme-forest,
body[data-theme="rose"] .os-window .window-body .theme-rose,
body[data-theme="navy"] .os-window .window-body .theme-navy {
    border-color: #fff !important;
    outline: 2px solid var(--accent) !important;
    outline-offset: 2px !important;
}

@media (max-width: 520px) {
    .os-window .window-body .control-choice-row,
    .os-window .window-body .visitor-action-row {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .os-window .window-body .control-choice-btn {
        width: 100% !important;
        min-width: 0 !important;
    }

    .os-window .window-body .theme-options {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        width: 100% !important;
    }
}


/* P12-N2G-BR — +Undangan tetap ringkas, tetapi tidak kosong. */
.os-window .window-body .create-invite-panel.compact-create-window{
    display:block!important;
}
.os-window .window-body .create-invite-panel .create-invite-hero-card{
    width:min(100%,680px)!important;
    margin:0 auto!important;
    padding:22px 0 8px!important;
    border:0!important;
    border-top:1px solid rgba(255,255,255,.14)!important;
    border-bottom:1px solid rgba(255,255,255,.14)!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
}
.os-window .window-body .create-invite-panel .create-invite-hero-card h2{
    max-width:620px!important;
    margin:0 0 10px!important;
    font-size:clamp(26px,4vw,42px)!important;
    line-height:1.04!important;
}
.os-window .window-body .create-invite-panel .create-invite-copy{
    max-width:560px!important;
    margin:0!important;
    color:rgba(255,255,255,.76)!important;
    font-size:15px!important;
    line-height:1.6!important;
}
.os-window .window-body .create-invite-panel .create-flow-strip{
    margin:16px 0 18px!important;
}
.os-window .window-body .create-invite-panel .create-flow-strip span{
    border:0!important;
    border-left:2px solid color-mix(in srgb,var(--accent) 68%,transparent)!important;
    background:rgba(255,255,255,.045)!important;
}
.os-window .window-body .create-invite-panel .detail-actions.desktop-action-single{
    display:block!important;
    width:min(100%,280px)!important;
    margin:0!important;
}
.os-window .window-body .create-invite-panel .detail-actions.desktop-action-single > a{
    width:100%!important;
    min-height:44px!important;
    border-radius:0!important;
}
@media(max-width:560px){
    .os-window .window-body .create-invite-panel .create-invite-hero-card{
        padding:18px 0 6px!important;
    }
    .os-window .window-body .create-invite-panel .create-flow-strip{
        display:grid!important;
        grid-template-columns:1fr!important;
        gap:6px!important;
    }
    .os-window .window-body .create-invite-panel .detail-actions.desktop-action-single{
        width:100%!important;
    }
}


/* P12-N2G-BR2 — +Undangan contrast and action recovery. */
.os-window .window-body .create-invite-panel .create-invite-hero-card h2 {
    color: var(--text, #f8fafc) !important;
}

.os-window .window-body .create-invite-panel .create-flow-strip {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 0 !important;
    margin: 18px 0 20px !important;
    border-top: 1px solid rgba(255,255,255,.14) !important;
    border-bottom: 1px solid rgba(255,255,255,.14) !important;
}

.os-window .window-body .create-invite-panel .create-flow-strip span {
    min-height: 46px !important;
    padding: 10px 14px !important;
    border: 0 !important;
    border-right: 1px solid rgba(255,255,255,.11) !important;
    background: transparent !important;
    color: rgba(255,255,255,.86) !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    text-align: left !important;
    justify-content: flex-start !important;
    opacity: 1 !important;
}

.os-window .window-body .create-invite-panel .create-flow-strip span:first-child {
    border-left: 3px solid #be185d !important;
}

.os-window .window-body .create-invite-panel .create-flow-strip span:last-child {
    border-right: 0 !important;
}

.os-window .window-body .create-invite-panel .detail-actions.desktop-action-single > a.primary-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 42px !important;
    padding: 9px 18px !important;
    border: 1px solid rgba(255,255,255,.16) !important;
    border-radius: 0 !important;
    background: linear-gradient(135deg, #7f1d45 0%, #9d174d 52%, #be185d 100%) !important;
    color: #fff !important;
    box-shadow: none !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.os-window .window-body .create-invite-panel .detail-actions.desktop-action-single > a.primary-btn:hover,
.os-window .window-body .create-invite-panel .detail-actions.desktop-action-single > a.primary-btn:focus-visible {
    background: linear-gradient(135deg, #9d174d 0%, #be185d 54%, #db2777 100%) !important;
    color: #fff !important;
    filter: brightness(1.04) !important;
    transform: none !important;
}

@media (max-width: 560px) {
    .os-window .window-body .create-invite-panel .create-flow-strip {
        grid-template-columns: 1fr !important;
        border-top: 0 !important;
        border-bottom: 0 !important;
    }

    .os-window .window-body .create-invite-panel .create-flow-strip span {
        min-height: 40px !important;
        border-right: 0 !important;
        border-bottom: 1px solid rgba(255,255,255,.11) !important;
    }

    .os-window .window-body .create-invite-panel .create-flow-strip span:last-child {
        border-bottom: 0 !important;
    }
}
