@import url("css/base.css");
@import url("css/layout.css");
@import url("css/components.css");
@import url("css/pages/home.css");
@import url("css/pages/modules.css");
@import url("css/responsive.css");
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');

:root {
    --sidebar-width: 268px;
    --header-height: 82px;
    --app-bg: #f8f5f1;
    --app-surface: rgba(255, 255, 255, .94);
    --app-line: #e8dfd7;
    --app-text: #292622;
    --app-muted: #817970;
    --app-accent: #b79a84;
    --app-accent-dark: #92735d;
    --app-accent-soft: #f0e5dd;
    --app-shadow: 0 18px 48px rgba(84, 66, 52, .08);
}

body:not(.auth-page) {
    background: radial-gradient(circle at 18% 8%, rgba(235, 220, 209, .34), transparent 26%), var(--app-bg) !important;
    color: var(--app-text);
    font-family: "DM Sans", Arial, sans-serif;
}

body:not(.auth-page) h1, body:not(.auth-page) h2, body:not(.auth-page) h3, body:not(.auth-page) h4 {
    font-family: "Playfair Display", Georgia, serif;
}

.top-bar {
    position: fixed !important;
    top: 0;
    right: 0;
    left: var(--sidebar-width);
    z-index: 100;
    min-height: var(--header-height) !important;
    height: var(--header-height);
    padding: 0 clamp(28px, 4vw, 62px) !important;
    display: flex !important;
    align-items: center;
    background: rgba(255, 253, 250, .9) !important;
    border-bottom: 1px solid var(--app-line) !important;
    box-shadow: none !important;
    backdrop-filter: blur(18px);
}

.top-logo {
    margin: 0 !important;
    font-family: "Playfair Display", Georgia, serif !important;
    font-size: clamp(26px, 3vw, 38px) !important;
    color: var(--app-text) !important;
}

.top-menu-button {
    display:none !important;
}

.menu-toggle {
    display:none !important;
    position:fixed;
    top:17px;
    left:18px;
    z-index:240;
    width:46px;
    height:46px;
    min-height:46px;
    padding:0;
    border:1px solid var(--app-line);
    border-radius:50%;
    background:#fff;
    box-shadow:0 10px 25px rgba(70, 52, 40, .08);
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
}

.menu-toggle span {
    width:18px;
    height:2px;
    border-radius:999px;
    background:var(--app-text);
    display:block;
}

.sidebar {
    position:fixed !important;
    inset:0 auto 0 0 !important;
    z-index:20;
    width:var(--sidebar-width) !important;
    height:100vh !important;
    padding:28px 17px 20px !important;
    display:flex !important;
    flex-direction:column;
    overflow-y:auto !important;
    overscroll-behavior:contain;
    background:rgba(255, 253, 250, .97) !important;
    border-right:1px solid var(--app-line) !important;
    box-shadow:12px 0 40px rgba(70, 52, 40, .04) !important;
    transform:none !important;
    scrollbar-width:thin;
    scrollbar-color:#d4c3b7 transparent;
}

.sidebar::-webkit-scrollbar {
    width:6px
}

.sidebar::-webkit-scrollbar-thumb {
    background:#d4c3b7;
    border-radius:999px
}

.sidebar-brand {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:10px;
    padding:0 10px 27px;
}

.sidebar .brand {
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    margin:0;
    padding:0 !important;
    min-height:0;
    background:none !important;
    border:0 !important;
}

.brand-mark {
    font-family:"Playfair Display", Georgia, serif;
    font-size:43px;
    font-style:italic;
    line-height:1;
    color:var(--app-text);
}

.brand-subtitle {
    margin-top:10px;
    color:#a08371;
    font-size:9px;
    letter-spacing:.27em;
    white-space:nowrap;
}

.sidebar-close {
    display:none;
    width:38px;
    height:38px;
    min-height:38px;
    padding:0;
    border:0;
    border-radius:50%;
    background:var(--app-accent-soft);
    color:var(--app-text);
    box-shadow:none;
    font-size:23px;
}

.sidebar-nav {
    display:grid !important;
    gap:5px;
}

.sidebar-nav .nav-link, .sidebar .sidebar-nav a {
    display:flex !important;
    align-items:center;
    gap:13px;
    min-height:48px;
    margin:0 !important;
    padding:10px 13px !important;
    border:1px solid transparent;
    border-radius:13px;
    color:#554e48 !important;
    font-size:15px;
    background:transparent !important;
    transform:none !important;
}

.sidebar-nav .nav-link:hover, .sidebar-nav .nav-link.active {
    background:linear-gradient(135deg, #eee2da, #f6eeea) !important;
    border-color:rgba(180, 149, 126, .14);
    color:var(--app-text) !important;
    transform:translateX(2px) !important;
}

.sidebar-nav .nav-link.active {
    font-weight:600;
}

.nav-icon {
    width:25px;
    height:25px;
    display:inline-grid;
    place-items:center;
    flex:0 0 25px;
    font-size:17px;
}

.sidebar-bottom {
    margin-top:auto;
    padding-top:22px;
}

.sidebar-quote {
    margin:0 0 12px !important;
    padding:17px !important;
    border:1px solid #ebddd3;
    border-radius:16px;
    background:linear-gradient(145deg, #fcf5f0, #f3e6de) !important;
}

.sidebar-quote p {
    margin:6px 0 0;
    color:#766c64;
    font-size:12px;
    line-height:1.55;
}

.sidebar .logout-button {
    width:100%;
    min-height:46px;
    padding:10px 13px;
    display:flex;
    justify-content:flex-start;
    gap:11px;
    border:0;
    border-radius:12px;
    background:transparent;
    color:#554e48;
    box-shadow:none;
}

.sidebar .logout-button:hover {
    background:#f1e8e2;
    color:var(--app-text);
    transform:none;
}

.sidebar-overlay {
    position:fixed;
    inset:0;
    z-index:150;
    display:none;
    background:rgba(39, 31, 26, .38);
    backdrop-filter:blur(4px);
}

.page-hero, .page-container, .page-layout, .home-hero {
    margin-left:var(--sidebar-width) !important;
}

.page-hero {
    width:auto !important;
    padding:calc(var(--header-height) + 42px) clamp(28px, 4vw, 62px) 26px !important;
    text-align:left !important;
}

.page-hero h1 {
    margin:7px 0 12px !important;
    font-size:clamp(46px, 6vw, 76px) !important;
    line-height:1 !important;
}

.page-hero > p:last-child {
    max-width:760px;
    margin:0 !important;
    font-size:17px;
}

.page-hero .gold-divider {
    display:none;
}

.page-container, .page-layout {
    width:auto !important;
    max-width:none !important;
    margin-top:0 !important;
    margin-right:0 !important;
    margin-bottom:60px !important;
    padding:18px clamp(28px, 4vw, 62px) 60px !important;
}

.home-hero {
    width:auto !important;
    min-height:100vh;
    padding:calc(var(--header-height) + 55px) clamp(28px, 4vw, 62px) 70px !important;
}

.panel, .dashboard-card, .budget-input-card, .budget-stat-card, .vendor-info-card, .vendor-mini-card, .todo-date-card, .payment-summary-card, .menu-summary-card, .music-summary-card, .photo-summary-card, .gift-summary-card, .document-summary-card, .stats-card, .stats-countdown-card, .notes-top-card, .notes-category-card, .note-card, .image-group-card, .theme-preview, .timeline-top-card, .dinner-table-wrapper, .guest-card, .feature-card, .chart-card {
    background:var(--app-surface) !important;
    border:1px solid var(--app-line) !important;
    box-shadow:var(--app-shadow) !important;
    backdrop-filter:blur(16px);
    border-radius:22px !important;
}

.panel {
    width:100% !important;
    margin:18px 0 !important;
}

.music-summary-grid, .summary-grid, .todo-summary-grid, .vendor-summary-grid, .music-summary-grid, .menu-summary-grid, .payment-summary-grid, .photo-summary-grid, .gift-summary-grid, .document-summary-grid {
    gap:16px !important;
}

button, .button, .soft-button, .primary-btn, .ghost-btn {
    font-family:"DM Sans", Arial, sans-serif;
}

@media (max-width:900px) {
    .top-bar {
        left:0 !important;
        padding-left:78px !important;
    }

    .menu-toggle {
        display:flex !important;
    }

    .sidebar {
        width:min(310px, 88vw) !important;
        transform:translateX(-105%) !important;
        transition:transform .28s ease !important;
    }

    .sidebar-open .sidebar {
        transform:translateX(0) !important;
    }

    .sidebar-open .sidebar-overlay {
        display:block;
    }

    .sidebar-close {
        display:grid;
        place-items:center;
    }

    .page-hero, .page-container, .page-layout, .home-hero {
        margin-left:0 !important;
    }

    .page-hero {
        padding:calc(var(--header-height) + 32px) 20px 24px !important;
    }

    .page-container, .page-layout {
        padding:14px 18px 55px !important;
    }

    .home-hero {
        padding:calc(var(--header-height) + 35px) 20px 60px !important;
    }

}

@media (max-width:560px) {
    :root {
        --header-height:72px
    }

    .top-logo {
        font-size:27px !important
    }

    .page-hero h1 {
        font-size:clamp(42px, 15vw, 60px) !important
    }

}

/* ==========================================================
SEDEŽNI RED V2 — PROFESIONALNI TLORIS IN BERLJIVA IMENA
========================================================== */

.seating-print-area {
    --seat-surface: #fffdfa;
    --seat-border: #cdbbae;
    --seat-text: #453c36;
    --seat-accent: #a8846d;
    --seat-empty: #8c8179;
}

.ceremony-seat-grid {
    gap: 24px 18px !important;
    align-items: start;
}

.seating-seat {
    position: relative;
    min-width: 92px;
    min-height: 92px;
    padding: 4px 5px 8px !important;
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 6px;
    border: 0 !important;
    border-radius: 14px !important;
    background: transparent !important;
    color: var(--seat-text) !important;
    box-shadow: none !important;
    overflow: visible !important;
    transform: none !important;
}

.seating-seat:hover {
    background: rgba(246, 237, 231, .82) !important;
    transform: translateY(-2px) !important;
}

.chair-shape {
    position: relative;
    display: block;
    width: 42px;
    height: 40px;
    flex: 0 0 40px;
}

.chair-shape::before {
    content: "";
    position: absolute;
    left: 7px;
    top: 1px;
    width: 28px;
    height: 24px;
    border: 2px solid var(--seat-border);
    border-radius: 9px 9px 5px 5px;
    background: linear-gradient(145deg, #fff, #f4ebe5);
    box-shadow: 0 5px 11px rgba(88, 65, 50, .10);
}

.chair-shape::after {
    content: "";
    position: absolute;
    left: 4px;
    top: 24px;
    width: 34px;
    height: 11px;
    border: 2px solid var(--seat-border);
    border-radius: 5px 5px 8px 8px;
    background: #fbf6f2;
}

.chair-shape i::before, .chair-shape i::after {
    content: "";
    position: absolute;
    top: 34px;
    width: 2px;
    height: 6px;
    background: var(--seat-border);
}

.chair-shape i::before {
    left: 10px;
}

.chair-shape i::after {
    right: 10px;
}

.seating-seat.occupied .chair-shape::before, .seating-seat.occupied .chair-shape::after {
    border-color: var(--seat-accent);
    background: linear-gradient(145deg, #eadbd1, #d6bdad);
}

.seating-seat.occupied .chair-shape i::before, .seating-seat.occupied .chair-shape i::after {
    background: var(--seat-accent);
}

.seat-guest-name {
    display: -webkit-box;
    width: 100%;
    max-width: 125px;
    min-height: 32px;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    color: var(--seat-empty);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.25;
    text-align: center;
    overflow-wrap: anywhere;
}

.seating-seat.occupied .seat-guest-name {
    color: var(--seat-text);
}

.seat-code {
    color: #ab9e95;
    font-size: 9px;
    font-weight: 500;
    letter-spacing: .08em;
}

/* Kartični pogled miz */

.round-table-area {
    width: min(520px, 100%) !important;
    min-width: 430px;
}

.round-table-area .dinner-seat, .rect-table-area .dinner-seat {
    width: 112px !important;
    height: 92px !important;
    min-height: 92px !important;
}

.rect-table-area {
    grid-template-columns: 120px minmax(220px, 1fr) 120px !important;
    grid-template-rows: auto 165px auto !important;
    gap: 18px !important;
}

.rect-side {
    gap: 12px !important;
}

/* Tloris prostora */

.room-actions {
    align-items: center;
}

.room-zoom-controls {
    display: inline-flex;
    gap: 5px;
}

.room-actions .icon-only {
    width: 38px;
    min-width: 38px;
    padding-inline: 0;
}

.room-actions .zoom-label {
    min-width: 70px;
}

.room-actions .active {
    background: #2f2925;
    color: #fff;
}

.dinner-room {
    overflow: auto !important;
}

.dinner-room-canvas {
    --room-zoom: 1;
    width: calc(1600px * var(--room-zoom));
    height: calc(1000px * var(--room-zoom));
    min-width: calc(1600px * var(--room-zoom));
    min-height: calc(1000px * var(--room-zoom));
    background-image: linear-gradient(rgba(170, 145, 127, .12) 1px, transparent 1px), linear-gradient(90deg, rgba(170, 145, 127, .12) 1px, transparent 1px), linear-gradient(rgba(170, 145, 127, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(170, 145, 127, .05) 1px, transparent 1px) !important;
    background-size: calc(100px * var(--room-zoom)) calc(100px * var(--room-zoom)), calc(100px * var(--room-zoom)) calc(100px * var(--room-zoom)), calc(20px * var(--room-zoom)) calc(20px * var(--room-zoom)), calc(20px * var(--room-zoom)) calc(20px * var(--room-zoom)) !important;
    transform-origin: top left;
}

.dinner-room-canvas.grid-hidden {
    background-image: none !important;
}

.room-table {
    transform: scale(var(--room-zoom));
    transform-origin: top left;
}

.room-table.round {
    width: 300px !important;
    height: 300px !important;
}

.room-table.rect {
    width: 370px !important;
    height: 280px !important;
}

.room-table .room-seat {
    width: 112px !important;
    height: 82px !important;
    min-height: 82px !important;
    transform: translate(-50%, -50%) !important;
    z-index: 4;
}

.room-table .room-seat:hover {
    transform: translate(-50%, -50%) translateY(-2px) !important;
}

.room-table-handle {
    z-index: 3;
    padding: 12px 22px !important;
    max-width: 65%;
    text-align: center;
}

@media (max-width: 700px) {
    .ceremony-seat-grid {
        grid-template-columns: repeat(2, minmax(95px, 1fr)) !important;
    }

    .round-table-area {
        min-width: 400px;
    }

    .room-actions {
        width: 100%;
        flex-wrap: wrap;
    }

}

@media print {
    .room-zoom-controls, #roomGridButton {
        display: none !important;
    }

    .dinner-room-canvas {
        --room-zoom: .72 !important;
    }

    .room-table {
        transform: scale(.72) !important;
    }

}

/* ==========================================================
KLARA 2026 — ENOTNI DESIGN SISTEM (GLOBALNI POPRAVKI)
========================================================== */

:root {
    --font-title:'Playfair Display', Georgia, serif;
    --font-subtitle:'DM Sans', sans-serif;
    --font-body:'DM Sans', sans-serif;
    --color-gold:#b8957e;
    --control-height:48px;
    --page-heading:clamp(42px, 5vw, 64px);
    --section-heading:clamp(25px, 3vw, 34px);
    --content-max:1440px
}

body {
    font-family:var(--font-body);
    background:#f8f5f1;
    color:#2d2925
}

h1, h2, h3, h4 {
    font-family:var(--font-title)
}

.app-page .page-hero, .page-container>.page-hero {
    width:min(var(--content-max), calc(100% - 64px));
    margin:0 auto 28px;
    padding:38px 0 12px;
    text-align:left
}

.app-page .page-hero h1, .page-container>.page-hero h1, .page-layout .page-hero h1 {
    font-size:var(--page-heading)!important;
    line-height:1.05;
    margin:7px 0 10px!important
}

.page-hero .gold-divider {
    display:none
}

.page-hero p {
    max-width:760px!important;
    margin:0!important;
    font-size:17px!important
}

.page-kicker, .eyebrow, .section-kicker {
    font-family:var(--font-subtitle);
    font-size:11px!important;
    font-weight:700;
    letter-spacing:.18em;
    color: #ad8b75;
    text-transform:uppercase
}

.page-container, .payment-container, .music-container, .menu-container, .photo-container, .gift-container, .document-container, .stats-container, .notes-container, .theme-container, .timeline-container, .seating-container {
    width:min(var(--content-max), calc(100% - 64px));
    margin:0 auto 72px
}

.panel, .card, .dashboard-card, .notes-top-card, .notes-category-card, .timeline-top-card, .dinner-table-wrapper {
    border:1px solid #e7ddd5;
    border-radius:22px;
    background:rgba(255, 255, 255, .94);
    box-shadow:0 16px 44px rgba(78, 59, 45, .07);
    padding:clamp(22px, 3vw, 32px)
}

.section-title-row, .section-heading-row {
    align-items:center;
    margin-bottom:24px
}

.section-title-row h2, .section-heading-row h2 {
    font-size:var(--section-heading);
    line-height:1.15
}

button, .button, .soft-button, .primary-btn, .ghost-btn, .guest-tab, .filter-button {
    min-height:44px;
    padding:0 18px!important;
    border-radius:11px!important;
    font-family:var(--font-body)!important;
    font-size:14px!important;
    font-weight:600!important;
    box-shadow:none!important;
    white-space:nowrap
}

.button-primary, button:not(.ghost-btn):not(.icon-btn):not(.menu-toggle):not(.sidebar-close):not(.entry-action-button):not(.seat-button):not(.dinner-seat) {
    background:var(--color-accent);
    border-color:var(--color-accent);
    color:#fff
}

.ghost-btn, .button-secondary {
    background:#fff;
    color:#66584e;
    border:1px solid #d9c9bd
}

.ghost-btn:hover, .button-secondary:hover {
    background:#f2e8e1;
    color:#4c4038
}

input:not([type=checkbox]):not([type=radio]):not([type=color]), select, textarea {
    width:100%;
    min-height:var(--control-height);
    margin:0!important;
    padding:11px 14px;
    border:1px solid #dfd2c8;
    border-radius:11px;
    background:#fff;
    color:#302b27;
    font-family:var(--font-body);
    font-size:15px;
    box-shadow:none
}

textarea {
    min-height:112px;
    line-height:1.5
}

.form-field {
    display:grid;
    gap:7px
}

.form-field label, label {
    font-family:var(--font-body);
    font-size:13px;
    font-weight:600;
    color:#675c54
}

.form-grid {
    display:grid;
    gap:16px
}

.form-grid.two {
    grid-template-columns:repeat(2, minmax(0, 1fr))
}

.form-grid.three {
    grid-template-columns:repeat(3, minmax(0, 1fr))
}

.guest-form-grid {
    grid-template-columns:repeat(4, minmax(160px, 1fr))!important;
    gap:14px!important
}

.dinner-builder-card {
    grid-template-columns:minmax(170px, .8fr) minmax(220px, 1.2fr) minmax(220px, 1fr) auto!important;
    gap:14px!important
}

.payment-form, .music-form, .menu-form, .photo-form, .gift-form, .document-form, .timeline-form {
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:16px!important
}

.payment-form button, .music-form button, .menu-form button, .photo-form button, .gift-form button, .document-form button, .timeline-form button {
    justify-self:start
}

.table-wrapper {
    border:1px solid #e6dbd2;
    border-radius:16px;
    background:#fff
}

.table-wrapper table {
    border:0;
    border-radius:0
}

.table-wrapper th {
    background:#f2e9e3;
    color:#574b43;
    font-family:var(--font-body);
    font-weight:700;
    letter-spacing:.04em
}

.table-wrapper td {
    padding:13px
}

.table-wrapper input, .table-wrapper select {
    min-width:130px;
    min-height:40px
}

/* ponudniki */

.vendor-summary-grid, .dashboard-grid, .feature-grid {
    gap:18px
}

.vendor-info-card, .vendor-mini-card {
    min-height:150px;
    display:flex;
    flex-direction:column;
    justify-content:center
}

.vendors-table td {
    min-width:180px
}

/* časovnica */

.timeline-list {
    max-width:940px;
    padding-left:32px
}

.timeline-item {
    display:grid;
    grid-template-columns:115px minmax(0, 1fr);
    gap:16px;
    max-width:900px
}

.timeline-item input, .timeline-item textarea {
    max-width:100%
}

/* glasba */

.music-tabs, .music-filter-buttons, .music-actions {
    display:flex;
    flex-wrap:wrap;
    gap:9px
}

.music-tabs button, .music-filter-buttons button {
    min-width:auto!important
}

.music-summary-grid {
    gap:16px
}

/* tema */

.theme-colors {
    display:grid!important;
    grid-template-columns:repeat(auto-fit, minmax(150px, 1fr));
    gap:16px
}

.theme-colors label {
    width:auto!important;
    min-height:150px;
    display:flex;
    flex-direction:column;
    gap:12px;
    align-items:stretch!important
}

.theme-colors input[type=color] {
    width:100%!important;
    height:86px!important;
    border:0;
    border-radius:14px;
    padding:0;
    margin:0
}

/* zapiski kot tabla */

#notesContainer {
    display:grid;
    gap:28px
}

.notes-category-card {
    background:#e9dfd3!important;
    padding:24px
}

.notes-category-card .notes-grid, .notes-category-card>div:last-child {
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(260px, 1fr));
    gap:18px
}

.note-card {
    min-height:230px!important;
    border:0!important;
    border-radius:3px 3px 16px 3px!important;
    background:#fff3a8!important;
    box-shadow:0 14px 25px rgba(70, 55, 35, .14)!important;
    transform:rotate(-.4deg)
}

.note-card:nth-child(even) {
    background:#f7d9dc!important;
    transform:rotate(.5deg)
}

.note-card:nth-child(3n) {
    background:#dceedd!important
}

.note-card input, .note-card textarea {
    background:transparent!important;
    border:0!important;
    border-bottom:1px solid rgba(70, 55, 35, .16)!important;
    border-radius:0!important
}

/* nočitve */

.accommodation-grid {
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(390px, 1fr));
    gap:18px
}

.accommodation-room {
    border:1px solid #e4d8cf;
    border-radius:18px;
    background:#fcfaf8;
    padding:20px
}

.accommodation-room>header {
    display:flex;
    justify-content:space-between;
    gap:16px;
    align-items:flex-start;
    border-bottom:1px solid #e9dfd7;
    padding-bottom:14px;
    margin-bottom:15px
}

.accommodation-room h3 {
    margin:4px 0;
    font-size:27px
}

.room-actions {
    display:flex;
    gap:7px
}

.room-person {
    padding:15px 0;
    border-bottom:1px solid #ece3dc
}

.id-upload-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
    margin-top:12px
}

.id-upload-grid label {
    min-height:130px;
    border:1px dashed #cdb9aa;
    border-radius:12px;
    padding:10px;
    text-align:center;
    cursor:pointer
}

.id-upload-grid input {
    display:none
}

.id-upload-grid img {
    width:100%;
    height:100px;
    object-fit:cover;
    border-radius:8px;
    margin-top:8px
}

.id-upload-grid em {
    display:grid;
    place-items:center;
    height:80px;
    color:#9a887b
}

.text-danger {
    background:transparent!important;
    color:#a25f5f!important;
    border:0!important;
    padding:5px 0!important;
    min-height:auto!important;
    margin-top:9px
}

/* statistika */

.stats-chart-grid {
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:18px
}

.chart-modern-card {
    padding:22px;
    border:1px solid #e7ddd5;
    border-radius:17px;
    background:#fcfaf8
}

.chart-modern-card.wide {
    grid-column:1/-1
}

.css-donut {
    --value:0;
    width:160px;
    aspect-ratio:1;
    border-radius:50%;
    margin:20px auto;
    display:grid;
    place-items:center;
    background:conic-gradient(var(--color-accent) calc(var(--value)*1%), #eee5de 0);
    position:relative
}

.css-donut:after {
    content:"";
    position:absolute;
    inset:18px;
    border-radius:50%;
    background:#fcfaf8
}

.css-donut strong {
    z-index:1;
    font:600 30px var(--font-title)
}

.mini-bars {
    display:grid;
    gap:16px;
    margin-top:18px
}

.mini-bar-row>div {
    display:flex;
    justify-content:space-between;
    gap:12px;
    font-size:13px
}

.mini-bar-row i {
    display:block;
    height:11px;
    background:#eee5de;
    border-radius:999px;
    overflow:hidden;
    margin-top:7px
}

.mini-bar-row em {
    display:block;
    height:100%;
    background:linear-gradient(90deg, var(--color-accent), var(--color-accent-dark));
    border-radius:999px
}

/* auth */

.auth-page-modern {
    background:#f5f0eb
}

.auth-shell {
    min-height:100vh;
    display:grid;
    grid-template-columns:minmax(0, 1.08fr) minmax(460px, .92fr)
}

.auth-story {
    display:grid;
    place-items:center;
    padding:60px;
    background:linear-gradient(135deg, rgba(245, 235, 228, .94), rgba(255, 255, 255, .78)), url('flowers_bg.png') center/cover
}

.auth-story-inner {
    max-width:680px
}

.auth-logo {
    font:italic 52px var(--font-title)
}

.auth-logo-sub {
    font-size:10px;
    letter-spacing:.28em;
    color:#9a7b67;
    margin:8px 0 70px
}

.auth-story h1 {
    font-size:clamp(48px, 5vw, 72px);
    line-height:1.02;
    margin:10px 0 22px
}

.auth-lead {
    font-size:18px;
    max-width:620px
}

.auth-feature-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
    margin-top:34px
}

.auth-feature-grid article {
    display:flex;
    gap:12px;
    padding:15px;
    border:1px solid rgba(177, 145, 122, .24);
    border-radius:14px;
    background:rgba(255, 255, 255, .62)
}

.auth-feature-grid b {
    color:var(--color-accent-dark)
}

.auth-feature-grid span {
    display:grid;
    gap:3px
}

.auth-feature-grid small {
    color:#81756d
}

.auth-card {
    align-self:center;
    width:min(560px, calc(100% - 48px));
    margin:40px auto;
    padding:34px;
    border:1px solid #e4d8cf;
    border-radius:24px;
    background:#fff;
    box-shadow:0 25px 70px rgba(70, 52, 40, .1)
}

.auth-card-head h2 {
    font-size:36px;
    margin:6px 0
}

.auth-tabs {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:5px;
    padding:5px;
    background:#f1e8e2;
    border-radius:13px;
    margin:25px 0
}

.auth-tabs button {
    background:transparent!important;
    color:#6d5e54!important;
    border:0!important
}

.auth-tabs button.active {
    background:#fff!important;
    box-shadow:0 4px 14px rgba(70, 52, 40, .08)!important
}

.auth-form {
    display:grid;
    gap:16px
}

.auth-submit {
    width:100%;
    margin-top:5px
}

.auth-privacy {
    font-size:12px;
    text-align:center;
    margin:20px 0 0
}

.auth-message {
    min-height:20px;
    margin:14px 0 0
}

@media(max-width:1050px) {
    .guest-form-grid {
        grid-template-columns:repeat(2, 1fr)!important
    }

    .dinner-builder-card {
        grid-template-columns:1fr 1fr!important
    }

    .auth-shell {
        grid-template-columns:1fr
    }

    .auth-story {
        padding:45px 28px
    }

    .auth-logo-sub {
        margin-bottom:35px
    }

    .auth-card {
        margin:0 auto 45px
    }

    .payment-form, .music-form, .menu-form, .photo-form, .gift-form, .document-form, .timeline-form {
        grid-template-columns:1fr
    }

}

@media(max-width:700px) {
    .app-page .page-hero, .page-container>.page-hero, .page-container, .payment-container, .music-container, .menu-container, .photo-container, .gift-container, .document-container, .stats-container, .notes-container, .theme-container, .timeline-container, .seating-container {
        width:calc(100% - 28px)
    }

    .guest-form-grid, .dinner-builder-card, .form-grid.two, .form-grid.three, .stats-chart-grid, .accommodation-grid, .id-upload-grid, .auth-feature-grid {
        grid-template-columns:1fr!important
    }

    .timeline-item {
        grid-template-columns:1fr
    }

    .chart-modern-card.wide {
        grid-column:auto
    }

    .auth-story h1 {
        font-size:44px
    }

    .auth-card {
        width:calc(100% - 28px);
        padding:24px
    }

    .panel {
        padding:20px
    }

}

/* ==========================================================
FINALNA ENOTNA TIPOGRAFIJA IN PORAVNAVA PODSTRANI
Ta blok mora ostati na koncu datoteke.
========================================================== */

:root {
    --klara-sidebar-width: 268px;
    --klara-header-height: 0px;
    --klara-content-gutter: clamp(36px, 5vw, 72px);
    --klara-content-max: 1450px;
    --klara-page-title-size: clamp(52px, 5.2vw, 72px);
    --klara-page-title-line: 1.02;
    --klara-page-description-size: 17px;
    --klara-page-kicker-size: 11px;
}

/* Skupna pisava naslovov in besedila */

body:not(.auth-page) {
    font-family: var(--font-body, "DM Sans", Arial, sans-serif) !important;
}

body:not(.auth-page) h1, body:not(.auth-page) h2, body:not(.auth-page) h3, body:not(.auth-page) h4 {
    font-family: var(--font-title, "Playfair Display", Georgia, serif) !important;
}

/* Strani, pri katerih je hero neposredno pred glavnim vsebinskim blokom */

body:not(.auth-page) > .page-hero {
    box-sizing: border-box !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 0 0 var(--klara-sidebar-width) !important;
    padding: calc(var(--klara-header-height) + 54px) var(--klara-content-gutter) 34px !important;
    text-align: left !important;
}

body:not(.auth-page) > .page-layout, body:not(.auth-page) > .payment-container, body:not(.auth-page) > .music-container, body:not(.auth-page) > .menu-container, body:not(.auth-page) > .photo-container, body:not(.auth-page) > .gift-container, body:not(.auth-page) > .document-container, body:not(.auth-page) > .stats-container, body:not(.auth-page) > .notes-container, body:not(.auth-page) > .theme-container, body:not(.auth-page) > .timeline-container, body:not(.auth-page) > .seating-container {
    box-sizing: border-box !important;
    width: auto !important;
    max-width: none !important;
    margin-left: var(--klara-sidebar-width) !important;
    margin-right: 0 !important;
    padding-left: var(--klara-content-gutter) !important;
    padding-right: var(--klara-content-gutter) !important;
}

/* Strani, kjer je hero znotraj glavnega page-containerja (npr. Svatje) */

body:not(.auth-page) > .page-container {
    box-sizing: border-box !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 0 72px var(--klara-sidebar-width) !important;
    padding: calc(var(--klara-header-height) + 54px) var(--klara-content-gutter) 72px !important;
}

body:not(.auth-page) > .page-container > .page-hero, body:not(.auth-page) > .page-layout > .page-hero {
    width: 100% !important;
    max-width: var(--klara-content-max) !important;
    margin: 0 0 36px !important;
    padding: 0 !important;
    text-align: left !important;
}

/* Vsi glavni naslovi podstrani */

body:not(.auth-page) .page-hero h1, body:not(.auth-page) .page-header h1, body:not(.auth-page) .module-header h1 {
    max-width: 1050px !important;
    margin: 8px 0 12px !important;
    font-size: var(--klara-page-title-size) !important;
    font-weight: 600 !important;
    line-height: var(--klara-page-title-line) !important;
    letter-spacing: -0.035em !important;
    text-align: left !important;
}

/* Nadnaslovi */

body:not(.auth-page) .page-kicker, body:not(.auth-page) .eyebrow, body:not(.auth-page) .section-kicker {
    margin: 0 0 8px !important;
    font-family: var(--font-body, "DM Sans", Arial, sans-serif) !important;
    font-size: var(--klara-page-kicker-size) !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    letter-spacing: .20em !important;
    text-transform: uppercase !important;
    text-align: left !important;
}

/* Opisi pod glavnim naslovom */

body:not(.auth-page) .page-hero > p:last-child, body:not(.auth-page) .page-description, body:not(.auth-page) .page-subtitle {
    max-width: 760px !important;
    margin: 0 !important;
    font-size: var(--klara-page-description-size) !important;
    line-height: 1.65 !important;
    text-align: left !important;
}

/* Compact hero ne sme več zmanjševati ali centrirati naslova */

body:not(.auth-page) .compact-hero {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    text-align: left !important;
}

body:not(.auth-page) .compact-hero h1 {
    font-size: var(--klara-page-title-size) !important;
}

/* Zmanjša razmik med naslovom strani in vsebino */

body:not(.auth-page) .compact-hero {
    margin-bottom: 32px !important;
}

body:not(.auth-page) .photo-container, body:not(.auth-page) .stats-container, body:not(.auth-page) .page-container {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Omejitev širine dejanske vsebine, a z enakim levim robom */

body:not(.auth-page) > .page-hero > *, body:not(.auth-page) > .page-layout > *, body:not(.auth-page) > .page-container > *, body:not(.auth-page) > .payment-container > *, body:not(.auth-page) > .music-container > *, body:not(.auth-page) > .menu-container > *, body:not(.auth-page) > .photo-container > *, body:not(.auth-page) > .gift-container > *, body:not(.auth-page) > .document-container > *, body:not(.auth-page) > .stats-container > *, body:not(.auth-page) > .notes-container > *, body:not(.auth-page) > .theme-container > *, body:not(.auth-page) > .timeline-container > *, body:not(.auth-page) > .seating-container > * {
    max-width: var(--klara-content-max);
}

@media (max-width: 900px) {
    :root {
        --klara-sidebar-width: 0px;
        --klara-content-gutter: 20px;
        --klara-page-title-size: clamp(44px, 12vw, 60px);
    }

    body:not(.auth-page) > .page-hero, body:not(.auth-page) > .page-container {
        margin-left: 0 !important;
        padding-top: calc(var(--klara-header-height) + 0px) !important;
    }

    body:not(.auth-page) > .page-layout, body:not(.auth-page) > .payment-container, body:not(.auth-page) > .music-container, body:not(.auth-page) > .menu-container, body:not(.auth-page) > .photo-container, body:not(.auth-page) > .gift-container, body:not(.auth-page) > .document-container, body:not(.auth-page) > .stats-container, body:not(.auth-page) > .notes-container, body:not(.auth-page) > .theme-container, body:not(.auth-page) > .timeline-container, body:not(.auth-page) > .seating-container {
        margin-left: 0 !important;
    }

}

/* ==========================================================
SVATJE — PRENOVLJEN OBRED IN RAZPORED MIZ
========================================================== */

/* Kompaktne nastavitve sedežnega reda za obred */

.guests-page .ceremony-control-card {
    width: min(920px, 100%);
    margin: 0 auto 28px;
    padding: 22px;
    display: grid;
    grid-template-columns: minmax(260px, 1fr) 72px minmax(260px, 1fr);
    gap: 22px;
    align-items: stretch;
    border: 1px solid #e7ddd5;
    border-radius: 20px;
    background: linear-gradient(145deg, #fff, #fbf8f5);
}

.guests-page .side-control {
    padding: 20px;
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    border: 1px solid #eadfd7;
    border-radius: 16px;
    background: #fff;
}

.guests-page .side-control h3 {
    margin: 0 0 8px;
    font-size: 25px;
}

.guests-page .side-control label {
    margin-top: 5px;
}

.guests-page .stepper {
    display: grid;
    grid-template-columns: 44px minmax(70px, 1fr) 44px;
    gap: 8px;
    align-items: center;
}

.guests-page .stepper button {
    width: 44px !important;
    min-width: 44px !important;
    height: 44px;
    min-height: 44px;
    padding: 0 !important;
    border: 1px solid #dfd2c8 !important;
    border-radius: 12px !important;
    background: #f1ebe6 !important;
    color: #4d453f !important;
    font-size: 20px !important;
}

.guests-page .stepper input {
    width: 100% !important;
    min-width: 0 !important;
    height: 44px;
    min-height: 44px;
    padding: 8px 10px !important;
    text-align: center;
    font-weight: 700;
    appearance: textfield;
}

.guests-page .stepper input::-webkit-outer-spin-button, .guests-page .stepper input::-webkit-inner-spin-button {
    margin: 0;
    appearance: none;
}

.guests-page .aisle-preview {
    min-height: 100%;
    display: grid;
    place-items: center;
    border-left: 1px dashed #d8c7bb;
    border-right: 1px dashed #d8c7bb;
    color: #9b7f6c;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .26em;
    writing-mode: vertical-rl;
}

/* Obredni sedežni red */

.guests-page .seating-print-area {
    --seat-border: #d8d2cc;
    --seat-text: #38332f;
    --seat-accent: #8d7564;
    --seat-empty: #aaa29b;
}

.guests-page .ceremony-stage {
    width: min(620px, 90%);
    margin: 0 auto 34px;
    padding: 22px 28px;
    border: 1px solid #e7ddd5;
    border-radius: 999px;
    background: linear-gradient(145deg, #fff, #f7f1ec);
    text-align: center;
}

.guests-page .ceremony-layout-new {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 86px minmax(0, 1fr);
    gap: 26px;
    align-items: start;
    padding: 30px;
    border: 1px solid #eee5de;
    border-radius: 22px;
    background: #fff;
}

.guests-page .ceremony-side h3 {
    margin: 0 0 24px;
    text-align: center;
    font-size: clamp(24px, 2.4vw, 33px);
}

.guests-page .ceremony-seat-grid {
    justify-content: center;
    gap: 18px 12px !important;
}

.guests-page .ceremony-aisle-new {
    align-self: stretch;
    min-height: 100%;
    display: grid;
    place-items: center;
    border-left: 1px dashed #decfc4;
    border-right: 1px dashed #decfc4;
    background: linear-gradient( 180deg, transparent, #faf6f2 18%, #faf6f2 82%, transparent );
}

.guests-page .ceremony-aisle-new span {
    color: #9a806e;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .28em;
    writing-mode: vertical-rl;
}

/* Svetli minimalistični sedeži */

.guests-page .seating-seat {
    min-width: 78px;
    min-height: 82px;
    gap: 4px;
}

.guests-page .chair-shape {
    width: 40px;
    height: 34px;
    flex-basis: 34px;
}

.guests-page .chair-shape::before {
    left: 6px;
    top: 2px;
    width: 28px;
    height: 22px;
    border: 1.5px solid #cfc8c2;
    border-radius: 12px 12px 8px 8px;
    background: #fff;
    box-shadow: 0 5px 14px rgba(67, 55, 46, .07);
}

.guests-page .chair-shape::after {
    left: 3px;
    top: 22px;
    width: 34px;
    height: 8px;
    border: 1.5px solid #cfc8c2;
    border-radius: 7px;
    background: #faf8f6;
}

.guests-page .chair-shape i::before, .guests-page .chair-shape i::after {
    top: 29px;
    height: 4px;
    background: #cfc8c2;
}

.guests-page .seating-seat.occupied .chair-shape::before, .guests-page .seating-seat.occupied .chair-shape::after {
    border-color: #a99383;
    background: linear-gradient(145deg, #fff, #eee5df);
}

.guests-page .seating-seat.occupied .chair-shape i::before, .guests-page .seating-seat.occupied .chair-shape i::after {
    background: #a99383;
}

.guests-page .seating-seat:hover {
    background: #f7f2ee !important;
}

/* Polja za dodajanje miz */

.guests-page .dinner-builder-card {
    grid-template-columns: minmax(165px, .75fr) minmax(210px, 1.1fr) minmax(260px, 1.45fr) auto !important;
    align-items: end;
}

.guests-page .table-input-group {
    display: grid;
    gap: 10px;
}

.guests-page #rectInputs {
    grid-template-columns: repeat(4, minmax(72px, 1fr));
}

.guests-page #rectInputs input, .guests-page #roundInputs input {
    min-width: 0;
}

/* Kartični pogled miz */

.guests-page .dinner-layout-new {
    grid-template-columns: repeat(auto-fit, minmax(430px, 1fr));
    gap: 24px;
}

.guests-page .dinner-table-card {
    min-height: 0;
    overflow: hidden;
}

/* Okrogla miza */

.guests-page .round-table-area {
    position: relative;
    width: min(520px, 100%) !important;
    min-width: 0;
    height: 500px;
    margin: 20px auto 10px;
}

.guests-page .round-table-center {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 190px;
    height: 190px;
    display: grid;
    place-items: center;
    transform: translate(-50%, -50%);
    border: 2px solid #d8c3b3;
    border-radius: 50%;
    background: linear-gradient(145deg, #fbf5f0, #efe1d7);
    color: #705e52;
    font-weight: 700;
}

.guests-page .round-table-area .dinner-seat {
    position: absolute;
    width: 92px !important;
    height: 76px !important;
    min-height: 76px !important;
    transform: translate(-50%, -50%);
}

/* Pravokotna miza */

.guests-page .rect-table-area {
    width: min(660px, 100%);
    margin: 20px auto 10px;
    display: grid;
    grid-template-columns: 110px minmax(270px, 1fr) 110px !important;
    grid-template-rows: 105px 190px 105px !important;
    gap: 12px !important;
    align-items: center;
}

.guests-page .rect-table-center {
    min-height: 155px;
    display: grid;
    place-items: center;
    border: 2px solid #d8c3b3;
    border-radius: 28px;
    background: linear-gradient(145deg, #fbf5f0, #efe1d7);
    color: #705e52;
    font-weight: 700;
}

.guests-page .rect-side {
    display: flex;
    gap: 8px !important;
    justify-content: space-evenly;
    align-items: center;
}

.guests-page .rect-side-left, .guests-page .rect-side-right {
    flex-direction: column;
}

.guests-page .rect-table-area .dinner-seat {
    width: 90px !important;
    height: 72px !important;
    min-height: 72px !important;
}

/* Tloris prostora */

.guests-page .room-table.round {
    width: 360px !important;
    height: 360px !important;
}

.guests-page .room-table.rect {
    width: 460px !important;
    height: 340px !important;
}

.guests-page .room-table.round::before, .guests-page .room-table.rect::before {
    content: "";
    position: absolute;
    inset: 27%;
    z-index: 0;
    border: 2px solid #d4bba8;
    background: linear-gradient(145deg, #fbf5ef, #efe0d5);
    box-shadow: 0 10px 25px rgba(85, 65, 50, .08);
}

.guests-page .room-table.round::before {
    border-radius: 50%;
}

.guests-page .room-table.rect::before {
    inset: 29% 22%;
    border-radius: 28px;
}

.guests-page .room-table-handle {
    z-index: 5;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    color: #6e5d51;
}

.guests-page .room-table .room-seat {
    width: 88px !important;
    height: 72px !important;
    min-height: 72px !important;
    z-index: 6;
}

/* Tablice */

@media (max-width: 900px) {
    .guests-page .ceremony-control-card {
        grid-template-columns: 1fr;
    }

    .guests-page .aisle-preview {
        min-height: 42px;
        writing-mode: horizontal-tb;
        border: 0;
        border-top: 1px dashed #d8c7bb;
        border-bottom: 1px dashed #d8c7bb;
    }

    .guests-page .ceremony-layout-new {
        grid-template-columns: 1fr;
    }

    .guests-page .ceremony-aisle-new {
        min-height: 58px;
        border: 0;
        border-top: 1px dashed #decfc4;
        border-bottom: 1px dashed #decfc4;
    }

    .guests-page .ceremony-aisle-new span {
        writing-mode: horizontal-tb;
    }

    .guests-page .dinner-builder-card {
        grid-template-columns: 1fr 1fr !important;
    }

}

/* Telefoni */

@media (max-width: 620px) {
    .guests-page .dinner-builder-card, .guests-page #rectInputs {
        grid-template-columns: 1fr !important;
    }

    .guests-page .ceremony-control-card, .guests-page .ceremony-layout-new {
        padding: 16px;
    }

    .guests-page .round-table-area {
        height: 430px;
    }

    .guests-page .round-table-center {
        width: 145px;
        height: 145px;
    }

}

/* ==========================================================
POPRAVEK CENTRIRANJA MIZ IN SEDEŽEV
========================================================== */

/* Kartice miz naj vsebino postavijo na sredino */

.guests-page .dinner-layout-new {
    align-items: stretch;
}

.guests-page .dinner-table-card {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    overflow: visible;
}

/* Glava in nastavitve ostanejo čez vso širino */

.guests-page .dinner-table-header, .guests-page .mini-table-controls {
    width: 100%;
}

/* Okrogla in pravokotna miza sta na sredini kartice */

.guests-page .round-table-area, .guests-page .rect-table-area {
    align-self: center;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Okrogli pregled dobi dovolj prostora za vse sedeže */

.guests-page .round-table-area {
    width: min(540px, 100%) !important;
    height: 520px;
}

/* Sedež naj bo vedno centriran na svoji izračunani točki */

.guests-page .round-table-area .dinner-seat {
    transform: translate(-50%, -50%) !important;
}

/* Tlorisna miza mora ustrezati dimenzijam v JavaScriptu */

.guests-page .room-table.round {
    width: 400px !important;
    height: 400px !important;
}

.guests-page .room-table.rect {
    width: 500px !important;
    height: 380px !important;
}

/* Omogoči, da sedeži niso odrezani ob robovih mize */

.guests-page .room-table {
    overflow: visible !important;
}

/* Okrogla površina mize */

.guests-page .room-table.round::before {
    inset: 27%;
    border-radius: 50%;
}

/* Pravokotna površina mize */

.guests-page .room-table.rect::before {
    inset: 28% 21%;
    border-radius: 28px;
}

/* Enotna velikost sedežev v tlorisu */

.guests-page .room-table .room-seat {
    width: 88px !important;
    height: 72px !important;
    min-height: 72px !important;
    transform: translate(-50%, -50%) !important;
}

/*
* Gumb za urejanje naj bo bližje sami mizi, 
* ne na skrajnem zgornjem robu območja.
*/

.guests-page .room-table-menu {
    top: 20% !important;
    right: 18% !important;
    z-index: 10;
}

.guests-page .room-table.rect .room-table-menu {
    top: 21% !important;
    right: 17% !important;
}

/* ==========================================================
PRAVILNA RAZPOREDITEV PRAVOKOTNE MIZE
========================================================== */

.guests-page .rect-table-area {
    display: grid !important;
    grid-template-columns: 110px minmax(300px, 1fr) 110px !important;
    grid-template-rows: 105px 190px 105px !important;
    gap: 12px !important;
    align-items: center;
    justify-items: center;
}

/* Zgornji sedeži */

.guests-page .rect-side-top {
    grid-column: 2;
    grid-row: 1;
    width: 100%;
    flex-direction: row;
}

/* Levi sedeži */

.guests-page .rect-side-left {
    grid-column: 1;
    grid-row: 2;
    height: 100%;
    flex-direction: column;
}

/* Sama miza */

.guests-page .rect-table-center {
    grid-column: 2;
    grid-row: 2;
    width: 100%;
    height: 100%;
    min-height: 0;
}

/* Desni sedeži */

.guests-page .rect-side-right {
    grid-column: 3;
    grid-row: 2;
    height: 100%;
    flex-direction: column;
}

/* Spodnji sedeži */

.guests-page .rect-side-bottom {
    grid-column: 2;
    grid-row: 3;
    width: 100%;
    flex-direction: row;
}

.guests-page .rect-side {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    gap: 8px !important;
    min-width: 0;
    min-height: 0;
}

.guests-page .rect-table-area .dinner-seat {
    flex: 0 0 82px;
    width: 82px !important;
    min-width: 82px !important;
    height: 72px !important;
    min-height: 72px !important;
}

/* ==========================================================
RAZPORED PROSTORA UPORABLJA ISTO MIZO KOT PREGLED MIZ
========================================================== */

.guests-page .room-table-copy {
    position: absolute;
    display: block;
    padding: 0;
    margin: 0;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
    cursor: grab;
    touch-action: none;
}

.guests-page .room-table-copy.dragging {
    cursor: grabbing;
    z-index: 50;
}

/*
* Velikost zunanjega premičnega elementa mora biti
* enaka dejanski velikosti prikaza mize.
*/

.guests-page .room-table-copy.round {
    width: 540px !important;
    height: 520px !important;
}

.guests-page .room-table-copy.rect {
    width: 660px !important;
    height: 424px !important;
}

/* Kopirana miza ne sme dobiti dodatnega odmika */

.guests-page .room-table-preview {
    margin: 0 !important;
}

/* Okrogla miza v prostoru */

.guests-page .room-table-copy .round-table-area {
    width: 540px !important;
    height: 520px !important;
    margin: 0 !important;
}

/* Pravokotna miza v prostoru */

.guests-page .room-table-copy .rect-table-area {
    width: 660px !important;
    height: 424px !important;
    margin: 0 !important;
}

/*
* Izklopimo stare navidezne površine mize, 
* ker pravo površino zdaj že ustvari
* round-table-center oziroma rect-table-center.
*/

.guests-page .room-table-copy::before {
    display: none !important;
}

/* Stari naslov mize ni več potreben */

.guests-page .room-table-copy .room-table-handle {
    display: none !important;
}

/* Gumb za urejanje mize */

.guests-page .room-table-copy .room-table-menu {
    position: absolute;
    top: 12px !important;
    right: 12px !important;
    z-index: 30;
    width: 46px;
    min-width: 46px;
    height: 42px;
    min-height: 42px;
    padding: 0 !important;
    border: 0;
    border-radius: 12px !important;
    background: #918d8c !important;
    color: #fff !important;
}

/*
* Sedeži so gumbi. Klik na njih dodeli gosta, 
* ne sproži premikanja mize.
*/

.guests-page .room-table-copy .dinner-seat {
    cursor: pointer;
}

/* ==========================================================
PONUDNIKI — KARTICE, PODROBNOSTI, PLAČILA, DOKUMENTI, SLIKE
Dodaj na KONEC datoteke style.css.
========================================================== */

.vendors-page .page-container {
    padding-top:18px!important
}

.vendor-dashboard {
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:16px;
    margin-bottom:18px
}

.vendor-dashboard article {
    padding:22px;
    border:1px solid var(--app-line);
    border-radius:20px;
    background:rgba(255, 255, 255, .94);
    box-shadow:var(--app-shadow)
}

.vendor-dashboard span {
    display:block;
    color:var(--app-muted);
    font-size:13px;
    margin-bottom:8px
}

.vendor-dashboard strong {
    font:600 clamp(23px, 2.4vw, 34px) "Playfair Display", Georgia, serif
}

.vendor-toolbar-panel {
    padding:24px!important
}

.vendor-toolbar {
    display:grid;
    grid-template-columns:minmax(260px, 1fr) 220px 240px;
    gap:12px
}

.vendor-primary-button {
    align-self:center
}

.vendors-card-grid {
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(260px, 1fr));
    gap:17px
}

.vendor-card {
    position:relative;
    min-height:275px;
    padding:22px;
    display:flex;
    flex-direction:column;
    border:1px solid #e7ddd5;
    border-radius:21px;
    background:rgba(255, 255, 255, .94);
    box-shadow:0 14px 35px rgba(78, 59, 45, .06);
    cursor:pointer;
    transition:.2s ease
}

.vendor-card:hover, .vendor-card:focus {
    outline:0;
    transform:translateY(-3px);
    border-color:#cbb5a5;
    box-shadow:0 20px 42px rgba(78, 59, 45, .11)
}

.vendor-card.vendor-selected {
    background:linear-gradient(145deg, #fff, #fbf5f0)
}

.vendor-card-top {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px
}

.vendor-card-icon {
    width:48px;
    height:48px;
    display:grid;
    place-items:center;
    border-radius:15px;
    background:#f0e5dd;
    color:#8b6d59;
    font-size:23px
}

.vendor-status {
    padding:6px 9px;
    border-radius:999px;
    background:#f0ece8;
    color:#756c65;
    font-size:10px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.06em
}

.status-rezervirano {
    background:#e6f1e8;
    color:#52715a
}

.status-ožji-izbor {
    background:#f4edda;
    color:#806d35
}

.status-zaključeno {
    background:#e7e5f2;
    color:#605c7c
}

.vendor-card>p {
    margin:22px 0 5px;
    color:#9a7b67;
    font-size:11px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.12em
}

.vendor-card h3 {
    margin:0 0 8px;
    font-size:27px;
    line-height:1.12
}

.vendor-card>strong {
    min-height:42px;
    color:#5c5149;
    font-size:14px
}

.vendor-card-meta {
    margin-top:auto;
    display:flex;
    justify-content:space-between;
    gap:10px;
    color:#887b72;
    font-size:12px
}

.vendor-progress {
    height:7px;
    margin:13px 0 8px;
    overflow:hidden;
    border-radius:999px;
    background:#eee6e0
}

.vendor-progress i {
    display:block;
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg, #b8957e, #8f6e59)
}

.vendor-card small {
    color:#887b72
}

.vendor-empty {
    grid-column:1/-1;
    padding:55px;
    border:1px dashed #d7c5b8;
    border-radius:20px;
    text-align:center;
    color:#8b7e75
}

.vendor-modal {
    position:fixed;
    inset:0;
    z-index:500;
    display:none
}

.vendor-modal.open {
    display:block
}

.vendor-modal-backdrop {
    position:absolute;
    inset:0;
    background:rgba(38, 31, 27, .52);
    backdrop-filter:blur(6px)
}

.vendor-modal-dialog {
    position:absolute;
    inset:4vh 4vw 4vh auto;
    width:min(900px, 92vw);
    display:flex;
    flex-direction:column;
    overflow:hidden;
    border:1px solid #e6dad1;
    border-radius:24px;
    background:#fbf8f5;
    box-shadow:0 35px 90px rgba(34, 27, 23, .28)
}

.vendor-modal-header, .vendor-modal-footer {
    padding:22px 26px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    background:#fff
}

.vendor-modal-header {
    border-bottom:1px solid #e9dfd7
}

.vendor-modal-header h2 {
    margin:3px 0 0;
    font-size:34px
}

.vendor-modal-close {
    width:44px!important;
    min-width:44px!important;
    height:44px;
    padding:0!important;
    border-radius:50%!important;
    background:#f1e8e2!important;
    color:#514740!important;
    font-size:24px!important
}

.vendor-modal-body {
    flex:1;
    overflow:auto;
    padding:0 26px 25px
}

.vendor-tabs {
    position:sticky;
    top:0;
    z-index:4;
    display:flex;
    gap:7px;
    padding:16px 0;
    background:#fbf8f5
}

.vendor-tabs button {
    background:#fff!important;
    color:#665a51!important;
    border:1px solid #dfd1c7!important
}

.vendor-tabs button.active {
    background:#2f2925!important;
    color:#fff!important;
    border-color:#2f2925!important
}

.vendor-tab-panel {
    display:none;
    padding-top:8px
}

.vendor-tab-panel.active {
    display:block
}

.vendor-form-grid {
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:16px
}

.vendor-form-grid label {
    display:grid;
    gap:7px
}

.vendor-span-2 {
    grid-column:1/-1
}

.vendor-check {
    display:flex!important;
    grid-template-columns:auto 1fr!important;
    align-items:center;
    gap:10px!important;
    padding:13px 15px;
    border:1px solid #e5d9d0;
    border-radius:12px;
    background:#fff
}

.vendor-check input {
    width:18px!important;
    height:18px
}

.vendor-finance-summary {
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:12px;
    margin-bottom:18px
}

.vendor-finance-summary article {
    padding:18px;
    border:1px solid #e6dbd2;
    border-radius:16px;
    background:#fff
}

.vendor-finance-summary span {
    display:block;
    color:#897c73;
    font-size:12px;
    margin-bottom:6px
}

.vendor-finance-summary strong {
    font-size:24px
}

.vendor-upload-box {
    display:grid;
    grid-template-columns:1fr auto;
    gap:12px;
    align-items:center;
    padding:18px;
    border:1px dashed #cdb9aa;
    border-radius:16px;
    background:#fff
}

.vendor-upload-box input {
    position:absolute;
    opacity:0;
    pointer-events:none
}

.vendor-upload-box label {
    min-height:48px;
    display:flex;
    align-items:center;
    padding:10px 14px;
    border-radius:11px;
    background:#f6f0eb;
    color:#796b61;
    cursor:pointer
}

.vendor-file-list {
    display:grid;
    gap:10px;
    margin-top:16px
}

.vendor-file-list article {
    display:grid;
    grid-template-columns:auto 1fr auto auto;
    gap:12px;
    align-items:center;
    padding:13px;
    border:1px solid #e7ddd5;
    border-radius:13px;
    background:#fff
}

.vendor-file-list article>span {
    font-size:22px
}

.vendor-file-list div {
    display:grid
}

.vendor-file-list small {
    color:#94867c
}

.vendor-file-list a {
    color:#8d6d58;
    font-weight:700
}

.vendor-file-list button, .vendor-gallery button {
    width:34px!important;
    min-width:34px!important;
    height:34px;
    min-height:34px;
    padding:0!important;
    border-radius:50%!important;
    background:#f0e7e1!important;
    color:#735f52!important
}

.vendor-storage-note, .vendor-empty-small {
    color:#8c7f76;
    font-size:13px
}

.vendor-gallery {
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(160px, 1fr));
    gap:13px;
    margin-top:16px
}

.vendor-gallery figure {
    position:relative;
    margin:0;
    overflow:hidden;
    border:1px solid #e4d8cf;
    border-radius:15px;
    background:#fff
}

.vendor-gallery img {
    width:100%;
    aspect-ratio:1/1;
    display:block;
    object-fit:cover
}

.vendor-gallery button {
    position:absolute;
    top:8px;
    right:8px
}

.vendor-gallery figcaption {
    padding:9px 11px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:12px
}

.vendor-modal-footer {
    border-top:1px solid #e9dfd7
}

.vendor-modal-footer>div {
    display:flex;
    gap:10px
}

.modal-open {
    overflow:hidden
}

@media(max-width:1050px) {
    .vendor-dashboard {
        grid-template-columns:repeat(2, 1fr)
    }

    .vendor-toolbar {
        grid-template-columns:1fr 1fr
    }

    .vendor-toolbar input {
        grid-column:1/-1
    }

}

@media(max-width:700px) {
    .vendor-dashboard, .vendor-form-grid, .vendor-finance-summary, .vendor-toolbar {
        grid-template-columns:1fr
    }

    .vendor-toolbar input, .vendor-span-2 {
        grid-column:auto
    }

    .vendor-modal-dialog {
        inset:0;
        width:100%;
        height:100%;
        border-radius:0
    }

    .vendor-modal-header, .vendor-modal-footer {
        padding:17px
    }

    .vendor-modal-body {
        padding:0 17px 20px
    }

    .vendor-tabs {
        overflow-x:auto
    }

    .vendor-upload-box {
        grid-template-columns:1fr
    }

    .vendor-modal-footer {
        align-items:stretch;
        flex-direction:column-reverse
    }

    .vendor-modal-footer>div {
        display:grid;
        grid-template-columns:1fr 1fr
    }

    .vendor-modal-footer>button {
        width:100%
    }

}

/* ==========================================================
KLARA — STATISTIKA V2
========================================================== */

.statistics-page .statistics-dashboard {
    display:grid;
    gap:20px
}

.stats-hero-grid {
    display:grid;
    grid-template-columns:minmax(0, 1.45fr) minmax(330px, .75fr);
    gap:18px
}

.stats-countdown-modern, .readiness-card, .stats-kpi-card, .stats-mini-card {
    border:1px solid var(--app-line, #e8dfd7);
    background:rgba(255, 255, 255, .95);
    box-shadow:var(--app-shadow, 0 18px 48px rgba(84, 66, 52, .08));
    border-radius:22px
}

.stats-countdown-modern {
    min-height:210px;
    padding:30px 34px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;
    background:linear-gradient(135deg, rgba(255, 255, 255, .98), rgba(246, 237, 231, .9))
}

.stats-countdown-copy {
    display:flex;
    align-items:flex-start;
    gap:18px
}

.stats-icon-badge {
    width:52px;
    height:52px;
    display:grid;
    place-items:center;
    flex:0 0 52px;
    border-radius:16px;
    background:#eee2da;
    color:#8f705c;
    font-size:24px
}

.stats-countdown-modern h2, .readiness-card h2 {
    margin:5px 0 8px;
    font-size:clamp(29px, 3vw, 42px)
}

.stats-countdown-modern p:last-child, .readiness-copy p:last-child {
    margin:0;
    color:var(--app-muted);
    line-height:1.6
}

.stats-countdown-numbers {
    display:flex;
    align-items:center;
    gap:24px;
    flex:0 0 auto
}

.stats-countdown-numbers>div {
    display:grid;
    text-align:center
}

.stats-countdown-numbers strong {
    font:600 clamp(46px, 5vw, 72px)/.95 var(--font-title);
    letter-spacing:-.04em
}

.stats-countdown-numbers span:not(.stats-countdown-divider) {
    margin-top:8px;
    color:var(--app-muted);
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:.12em
}

.stats-countdown-divider {
    width:1px;
    height:72px;
    background:var(--app-line)
}

.readiness-card {
    padding:26px;
    display:flex;
    align-items:center;
    gap:24px
}

.readiness-ring {
    --readiness:0;
    width:148px;
    aspect-ratio:1;
    flex:0 0 148px;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:conic-gradient(var(--app-accent-dark) calc(var(--readiness)*1%), #eee6df 0);
    position:relative
}

.readiness-ring::after {
    content:"";
    position:absolute;
    inset:13px;
    border-radius:50%;
    background:#fff
}

.readiness-ring>div {
    z-index:1;
    display:grid;
    text-align:center
}

.readiness-ring strong {
    font:600 34px var(--font-title)
}

.readiness-ring span {
    font-size:10px;
    color:var(--app-muted);
    text-transform:uppercase;
    letter-spacing:.1em
}

.stats-kpi-grid {
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:16px
}

.stats-kpi-card {
    padding:22px;
    min-height:190px;
    display:flex;
    flex-direction:column
}

.stats-kpi-head {
    display:flex;
    align-items:center;
    gap:10px
}

.stats-kpi-icon {
    width:34px;
    height:34px;
    display:grid;
    place-items:center;
    border-radius:11px;
    background:#f1e7e0;
    color:#866d5d;
    font-weight:700
}

.stats-kpi-head small, .stats-mini-card small {
    font-weight:700;
    color:#70665f
}

.stats-kpi-card>strong {
    margin:22px 0 8px;
    font:600 clamp(29px, 2.5vw, 39px) var(--font-title);
    letter-spacing:-.025em
}

.stats-kpi-card p {
    margin:0;
    color:var(--app-muted);
    font-size:13px;
    line-height:1.45
}

.stats-progress {
    height:7px;
    margin-top:auto;
    border-radius:999px;
    background:#eee7e1;
    overflow:hidden
}

.stats-progress i {
    display:block;
    width:0;
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg, var(--app-accent), var(--app-accent-dark));
    transition:width .65s ease
}

.stats-secondary-grid {
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:16px
}

.stats-mini-card {
    padding:18px 20px;
    display:flex;
    align-items:center;
    gap:15px
}

.stats-mini-card>span {
    width:42px;
    height:42px;
    display:grid;
    place-items:center;
    flex:0 0 42px;
    border-radius:13px;
    background:#f4ece7;
    color:#8a715f;
    font-size:18px
}

.stats-mini-card>div {
    min-width:0
}

.stats-mini-card strong {
    display:block;
    margin:3px 0 2px;
    font:600 27px var(--font-title)
}

.stats-mini-card p {
    margin:0;
    color:var(--app-muted);
    font-size:12px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis
}

.stats-section-note {
    max-width:380px;
    color:var(--app-muted);
    font-size:13px
}

.stats-next-grid {
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:16px
}

.stats-next-card {
    min-height:310px;
    padding:22px;
    border:1px solid #e8ddd5;
    border-radius:18px;
    background:#fcfaf8;
    display:flex;
    flex-direction:column
}

.stats-next-heading {
    display:flex;
    gap:12px;
    align-items:center;
    padding-bottom:16px;
    border-bottom:1px solid #e9dfd7
}

.stats-next-heading>span {
    width:38px;
    height:38px;
    display:grid;
    place-items:center;
    border-radius:12px;
    background:#eee3dc;
    color:#826957;
    font-weight:700
}

.stats-next-heading small {
    color:#9a887b;
    font-size:10px;
    text-transform:uppercase;
    letter-spacing:.14em
}

.stats-next-heading h3 {
    margin:2px 0 0;
    font-size:21px
}

.stats-next-card ul {
    list-style:none;
    margin:16px 0;
    padding:0;
    display:grid;
    gap:2px
}

.stats-next-card li {
    display:flex;
    gap:10px;
    align-items:flex-start;
    padding:10px 0;
    border-bottom:1px solid #eee5de
}

.stats-list-dot {
    width:7px;
    height:7px;
    margin-top:7px;
    flex:0 0 7px;
    border-radius:50%;
    background:var(--app-accent)
}

.stats-next-card li div {
    display:grid;
    gap:3px
}

.stats-next-card li strong {
    font-size:13px
}

.stats-next-card li small {
    color:var(--app-muted);
    font-size:11px;
    line-height:1.45
}

.stats-empty-item {
    color:var(--app-muted)
}

.stats-empty-item>span {
    color:#9a806f
}

.stats-next-card>a {
    margin-top:auto;
    display:flex;
    justify-content:space-between;
    padding-top:15px;
    color:var(--app-accent-dark);
    font-size:13px;
    font-weight:700;
    text-decoration:none
}

.stats-next-card>a:hover {
    color:var(--app-text)
}

.statistics-page .stats-visual-panel {
    margin-top:0!important
}

.statistics-page .chart-modern-card {
    min-height:285px
}

.statistics-page .css-donut {
    width:175px
}

.statistics-page .mini-bars {
    gap:20px
}

@media(max-width:1180px) {
    .stats-hero-grid {
        grid-template-columns:1fr
    }

    .readiness-card {
        justify-content:center
    }

    .stats-kpi-grid, .stats-secondary-grid {
        grid-template-columns:repeat(2, minmax(0, 1fr))
    }

}

@media(max-width:760px) {
    .stats-countdown-modern {
        align-items:flex-start;
        flex-direction:column
    }

    .stats-countdown-numbers {
        width:100%;
        justify-content:center
    }

    .readiness-card {
        align-items:flex-start;
        flex-direction:column
    }

    .readiness-ring {
        align-self:center
    }

    .stats-kpi-grid, .stats-secondary-grid, .stats-next-grid {
        grid-template-columns:1fr
    }

    .stats-section-note {
        display:none
    }

    .stats-countdown-modern {
        padding:24px
    }

    .stats-countdown-copy {
        gap:12px
    }

    .stats-countdown-numbers strong {
        font-size:50px
    }

    .stats-next-card {
        min-height:0
    }

}

/* ==========================================================
   KLARA — ZAPISKI KOT TABLA Z NALEPLJENIMI LISTKI
   Ta celoten blok prilepi na KONEC datoteke style.css.
========================================================== */

.notes-page {
    --notes-ink: #4d4038;
    --notes-soft-ink: #82736a;
    --notes-cork-light: #c8a17c;
    --notes-cork-dark: #a97853;
    --notes-frame: #7d5b42;
}

.notes-page .page-container {
    padding-top: 0 !important;
}

.notes-toolbar {
    display: grid;
    grid-template-columns: minmax(240px, 1fr) minmax(240px, .8fr) auto auto;
    gap: 12px;
    align-items: center;
    margin-bottom: 22px !important;
    padding: 18px !important;
}

.notes-search {
    position: relative;
}

.notes-search > span {
    position: absolute;
    left: 16px;
    top: 50%;
    z-index: 2;
    transform: translateY(-50%);
    color: #9a887d;
    font-size: 19px;
}

.notes-search input {
    padding-left: 45px !important;
}

.notes-add-group-button,
.notes-default-button {
    height: 48px;
}

.notes-board-shell {
    position: relative;
    overflow: hidden;
    padding: clamp(20px, 3vw, 34px);
    border: 12px solid var(--notes-frame);
    border-radius: 26px;
    background:
        radial-gradient(circle at 20% 30%, rgba(255,255,255,.10) 0 2px, transparent 3px),
        radial-gradient(circle at 70% 60%, rgba(79,48,30,.09) 0 2px, transparent 3px),
        linear-gradient(125deg, rgba(255,255,255,.08), transparent 28%),
        repeating-linear-gradient(
            18deg,
            rgba(255,255,255,.025) 0 4px,
            rgba(96,62,41,.025) 4px 8px
        ),
        linear-gradient(135deg, var(--notes-cork-light), var(--notes-cork-dark));
    box-shadow:
        inset 0 0 0 3px rgba(255,255,255,.16),
        inset 0 0 36px rgba(73,42,24,.20),
        0 22px 55px rgba(73,48,32,.16);
}

.notes-board-shell::before,
.notes-board-shell::after {
    content: "";
    position: absolute;
    pointer-events: none;
}

.notes-board-shell::before {
    inset: 0;
    opacity: .26;
    background-image:
        repeating-radial-gradient(circle at 0 0, transparent 0 9px, rgba(72,42,24,.08) 10px 11px);
    background-size: 34px 34px;
}

.notes-board-shell::after {
    inset: 12px;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 12px;
}

.notes-board-heading,
.notes-board {
    position: relative;
    z-index: 1;
}

.notes-board-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 28px;
    padding: 0 4px;
}

.notes-board-heading h2 {
    margin: 3px 0 0;
    color: #fffaf5;
    font-size: clamp(30px, 3vw, 42px);
    text-shadow: 0 2px 4px rgba(68,42,27,.22);
}

.notes-board-heading .page-kicker,
.notes-board-heading > p {
    color: rgba(255,250,245,.82) !important;
}

.notes-board-heading > p {
    max-width: 360px;
    margin: 0;
    text-align: right;
    font-size: 13px;
    line-height: 1.55;
}

.notes-board {
    display: grid;
    gap: 30px;
}

.notes-category-card {
    position: relative;
    padding: 24px !important;
    border: 1px solid rgba(255,255,255,.35) !important;
    border-radius: 20px !important;
    background: rgba(255,250,245,.16) !important;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.22),
        0 13px 30px rgba(69,41,24,.10) !important;
    backdrop-filter: blur(2px);
}

.notes-category-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 22px;
}

.notes-category-header p {
    margin: 0 0 2px;
    color: rgba(255,250,245,.72);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.notes-category-header h3 {
    margin: 0;
    color: #fffaf5;
    font-size: clamp(24px, 2.4vw, 32px);
    text-shadow: 0 2px 4px rgba(69,41,24,.20);
}

.notes-category-actions {
    display: flex;
    gap: 8px;
}

.notes-category-actions button {
    border: 1px solid rgba(255,255,255,.28) !important;
    background: rgba(73,49,33,.34) !important;
    color: #fff !important;
    backdrop-filter: blur(8px);
}

.notes-category-actions button:hover {
    background: rgba(73,49,33,.50) !important;
}

.notes-category-delete {
    width: 44px !important;
    min-width: 44px !important;
    padding: 0 !important;
    font-size: 20px !important;
}

.notes-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(215px, 1fr));
    gap: 26px;
    align-items: start;
}

.note-card {
    --note-color: #fff0bd;
    --note-font: "Poppins", sans-serif;
    --note-rotation: -1deg;

    position: relative;
    min-height: 225px !important;
    padding: 28px 22px 20px !important;
    display: flex;
    flex-direction: column;
    overflow: visible;
    border: 0 !important;
    border-radius: 2px 2px 14px 2px !important;
    background:
        linear-gradient(145deg, rgba(255,255,255,.17), transparent 34%),
        var(--note-color) !important;
    color: var(--notes-ink);
    box-shadow:
        0 2px 2px rgba(63,43,28,.06),
        0 12px 22px rgba(63,43,28,.20),
        inset 0 -12px 24px rgba(95,69,44,.035) !important;
    transform: rotate(var(--note-rotation));
    transform-origin: 50% 10%;
    transition:
        transform .22s ease,
        box-shadow .22s ease,
        filter .22s ease;
    cursor: pointer;
    isolation: isolate;
}

.note-card::before {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 18px;
    border-radius: 0 0 14px 2px;
    background: linear-gradient(to top, rgba(78,55,37,.06), transparent);
    pointer-events: none;
}

.note-card:hover,
.note-card:focus-visible {
    z-index: 8;
    outline: none;
    transform: rotate(0deg) translateY(-7px) scale(1.025);
    box-shadow:
        0 4px 5px rgba(63,43,28,.08),
        0 20px 32px rgba(63,43,28,.28) !important;
}

.note-card-tape {
    position: absolute;
    top: -11px;
    left: 50%;
    width: 76px;
    height: 24px;
    transform: translateX(-50%) rotate(-2deg);
    border: 1px solid rgba(160,119,87,.12);
    background:
        repeating-linear-gradient(
            90deg,
            rgba(255,255,255,.34) 0 4px,
            rgba(245,217,197,.16) 4px 8px
        ),
        rgba(255,231,215,.76);
    box-shadow: 0 3px 7px rgba(77,53,36,.08);
    opacity: .88;
    pointer-events: none;
}

.note-card:nth-child(even) .note-card-tape {
    transform: translateX(-50%) rotate(3deg);
}

.pinned-note .note-card-tape {
    width: 62px;
    background: rgba(255,204,210,.80);
}

.pinned-note::after {
    content: "";
    position: absolute;
    top: 7px;
    left: 50%;
    z-index: 3;
    width: 14px;
    height: 14px;
    transform: translateX(-50%);
    border-radius: 50%;
    background: #d86f7d;
    box-shadow:
        inset 0 3px 4px rgba(255,255,255,.55),
        0 3px 6px rgba(75,44,37,.24);
}

.note-card-top-actions {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 4;
    display: flex;
    gap: 5px;
    opacity: 0;
    transform: translateY(-4px);
    transition: .18s ease;
}

.note-card:hover .note-card-top-actions,
.note-card:focus-within .note-card-top-actions {
    opacity: 1;
    transform: translateY(0);
}

.note-card-top-actions button {
    width: 32px !important;
    min-width: 32px !important;
    height: 32px !important;
    min-height: 32px !important;
    padding: 0 !important;
    display: grid;
    place-items: center;
    border: 0 !important;
    border-radius: 50% !important;
    background: rgba(255,255,255,.74) !important;
    color: #65564d !important;
    font-size: 15px !important;
    box-shadow: 0 5px 12px rgba(81,55,39,.12) !important;
}

.note-card-copy {
    min-height: 132px;
    padding-top: 12px;
}

.note-card-copy > p {
    margin: 0 0 12px;
    color: rgba(89,73,63,.58);
    font-family: "DM Sans", sans-serif;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.note-card h4 {
    margin: 0;
    font-family: var(--note-font) !important;
    font-size: clamp(23px, 2vw, 29px);
    font-weight: 600;
    line-height: 1.18;
    overflow-wrap: anywhere;
}

.note-card-preview {
    display: -webkit-box;
    margin-top: 14px;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    color: rgba(78,65,57,.76);
    font-family: var(--note-font);
    font-size: 13px;
    line-height: 1.55;
}

.note-card-footer {
    margin-top: auto;
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 12px;
}

.note-card-indicators {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.note-card-indicators span {
    min-height: 25px;
    padding: 4px 8px;
    display: inline-flex;
    align-items: center;
    border: 1px solid rgba(91,71,58,.10);
    border-radius: 999px;
    background: rgba(255,255,255,.42);
    color: rgba(78,65,57,.68);
    font-family: "DM Sans", sans-serif;
    font-size: 10px;
    font-weight: 700;
}

.note-open-button {
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 !important;
    display: grid;
    place-items: center;
    flex: 0 0 42px;
    border: 0 !important;
    border-radius: 50% !important;
    background: rgba(255,255,255,.80) !important;
    color: #756157 !important;
    font-size: 25px !important;
    box-shadow: 0 8px 16px rgba(75,50,34,.14) !important;
}

.note-open-button:hover {
    transform: rotate(90deg) scale(1.06);
}

.note-card-add {
    min-height: 225px !important;
    align-items: center;
    justify-content: center;
    text-align: center;
    border: 2px dashed rgba(255,255,255,.46) !important;
    background: rgba(255,250,245,.13) !important;
    color: #fff !important;
    box-shadow: none !important;
}

.note-card-add::before {
    display: none;
}

.note-card-add > span {
    width: 58px;
    height: 58px;
    margin-bottom: 12px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: rgba(255,255,255,.18);
    font-size: 34px;
}

.note-card-add strong {
    font-family: "Playfair Display", serif;
    font-size: 22px;
}

.note-card-add small {
    margin-top: 5px;
    color: rgba(255,255,255,.72);
}

.notes-empty-state {
    padding: 70px 20px;
    text-align: center;
    color: #fffaf5;
}

.notes-empty-state > span {
    font-size: 42px;
}

.notes-empty-state h3 {
    margin: 10px 0 4px;
    color: #fff;
}

/* Urejevalnik */

.note-editor-modal {
    position: fixed;
    inset: 0;
    z-index: 900;
    display: none;
}

.note-editor-modal.open {
    display: block;
}

.note-editor-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(48,38,32,.54);
    backdrop-filter: blur(8px);
}

.note-editor-dialog {
    position: absolute;
    inset: 3vh 3vw;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid #eadfd8;
    border-radius: 28px;
    background: #fbf8f5;
    box-shadow: 0 35px 100px rgba(43,32,26,.28);
}

.note-editor-header {
    padding: 18px 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    border-bottom: 1px solid #eadfd8;
    background: rgba(255,255,255,.92);
}

.note-editor-header h2 {
    margin: 3px 0 0;
    font-size: clamp(26px, 3vw, 37px);
}

.note-editor-header-actions {
    display: flex;
    gap: 9px;
}

.note-editor-layout {
    min-height: 0;
    flex: 1;
    display: grid;
    grid-template-columns: 300px minmax(0, 1fr);
}

.note-editor-sidebar {
    overflow-y: auto;
    padding: 23px;
    border-right: 1px solid #eadfd8;
    background: #fffdfb;
}

.editor-field,
.editor-fieldset {
    margin: 0 0 23px;
    padding: 0;
    display: grid;
    gap: 10px;
    border: 0;
}

.editor-field > span,
.editor-fieldset legend {
    margin-bottom: 8px;
    color: #65574f;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.editor-choice-grid {
    display: grid;
    gap: 8px;
}

.editor-choice {
    min-height: 72px;
    padding: 12px !important;
    display: grid;
    grid-template-columns: 30px 1fr;
    grid-template-rows: auto auto;
    gap: 2px 9px;
    text-align: left;
    border: 1px solid #eadfd8 !important;
    background: #fff !important;
    color: #564b44 !important;
}

.editor-choice > span {
    grid-row: 1 / 3;
    font-size: 22px;
}

.editor-choice strong {
    align-self: end;
}

.editor-choice small {
    color: #94867d;
    font-weight: 400;
}

.editor-choice.active {
    border-color: #e7b7bd !important;
    background: #fff0f2 !important;
}

.note-color-picker {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
}

.note-color-picker button {
    aspect-ratio: 1;
    min-height: 42px;
    padding: 0 !important;
    border: 2px solid transparent !important;
    border-radius: 10px !important;
    background: var(--swatch) !important;
    box-shadow: inset 0 0 0 1px rgba(86,64,52,.08) !important;
}

.note-color-picker button.active {
    border-color: #c5818d !important;
    box-shadow:
        inset 0 0 0 3px #fff,
        0 0 0 2px #c5818d !important;
}

.editor-format-row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 7px;
}

.editor-format-row button,
.editor-font-size button {
    min-width: 0 !important;
    padding: 0 !important;
    border: 1px solid #eadfd8 !important;
    background: #fff !important;
    color: #62564e !important;
}

.editor-font-size {
    display: grid;
    grid-template-columns: 1fr 55px 1fr;
    gap: 7px;
}

.editor-font-size output {
    display: grid;
    place-items: center;
    border: 1px solid #eadfd8;
    border-radius: 10px;
    background: #fff;
    font-weight: 700;
}

.editor-tip {
    padding: 17px;
    border: 1px solid #efdfd1;
    border-radius: 15px;
    background: linear-gradient(145deg, #fffaf5, #f9efe6);
}

.editor-tip p {
    margin: 8px 0 0;
    color: #84756b;
    font-size: 12px;
    line-height: 1.55;
}

.note-paper-wrap {
    min-width: 0;
    overflow: auto;
    padding: clamp(22px, 4vw, 48px);
    display: grid;
    place-items: start center;
    background:
        radial-gradient(circle at 50% 0, rgba(255,255,255,.94), transparent 42%),
        #f5efea;
}

.note-paper-preview {
    --editor-note-color: #fff4e8;
    --editor-note-font: "Poppins", sans-serif;
    --editor-note-size: 16px;

    position: relative;
    width: min(760px, 100%);
    min-height: 800px;
    padding: 58px clamp(30px, 5vw, 62px) 52px;
    border: 1px solid rgba(186,145,130,.28);
    border-radius: 18px;
    background:
        repeating-linear-gradient(
            to bottom,
            transparent 0 34px,
            rgba(192,137,142,.16) 35px 36px
        ),
        var(--editor-note-color);
    box-shadow:
        0 25px 55px rgba(90,64,51,.18),
        inset 0 0 70px rgba(255,255,255,.38);
    transition: background-color .2s ease;
}

.note-paper-tape {
    position: absolute;
    top: -12px;
    left: 50%;
    width: 112px;
    height: 34px;
    transform: translateX(-50%) rotate(1deg);
    background:
        repeating-linear-gradient(45deg, rgba(255,255,255,.22) 0 7px, transparent 7px 14px),
        rgba(239,174,177,.75);
    opacity: .8;
}

.note-paper-heart {
    position: absolute;
    top: 38px;
    right: 38px;
    color: #e899a1;
    font-family: "Playfair Display", serif;
    font-size: 41px;
    transform: rotate(12deg);
}

#editorPaperTitle {
    width: calc(100% - 70px) !important;
    min-height: 64px;
    padding: 0 0 12px !important;
    border: 0 !important;
    border-bottom: 2px solid rgba(202,130,138,.25) !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #5b403f;
    font-family: "Playfair Display", serif;
    font-size: clamp(34px, 4vw, 52px);
    font-weight: 600;
}

.note-editor-toolbar {
    position: sticky;
    top: 0;
    z-index: 5;
    margin: 18px 0 20px;
    padding: 7px;
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    border: 1px solid rgba(177,137,129,.18);
    border-radius: 12px;
    background: rgba(255,255,255,.72);
    backdrop-filter: blur(12px);
}

.note-editor-toolbar button {
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #62534d !important;
}

.note-editor-toolbar button:hover,
.note-editor-toolbar button.active {
    background: rgba(221,173,178,.20) !important;
}

.note-editor-toolbar > span {
    width: 1px;
    margin: 4px 3px;
    background: rgba(112,90,79,.16);
}

.note-rich-editor {
    min-height: 300px;
    padding: 5px 3px;
    color: #564b47;
    font-family: var(--editor-note-font);
    font-size: var(--editor-note-size);
    line-height: 2.2;
    outline: none;
}

.note-rich-editor:empty::before {
    content: attr(data-placeholder);
    color: rgba(89,72,64,.38);
}

.note-rich-editor ul {
    padding-left: 26px;
}

.note-editor-extra-grid {
    margin-top: 25px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.note-editor-extra-grid label {
    display: grid;
    gap: 7px;
}

.note-editor-extra-grid label > span {
    color: #796960;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.note-editor-extra-grid input {
    background: rgba(255,255,255,.56) !important;
}

.note-editor-checklist,
.note-editor-image-section {
    margin-top: 26px;
    padding-top: 22px;
    border-top: 1px solid rgba(137,101,88,.16);
}

.note-editor-subheading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.note-editor-subheading h3 {
    margin: 0;
    font-size: 23px;
}

#editorChecklist {
    margin-top: 14px;
    display: grid;
    gap: 9px;
}

.note-checklist-empty {
    margin: 0;
    color: rgba(89,72,64,.50);
    font-size: 13px;
}

.note-editor-check-row {
    display: grid;
    grid-template-columns: 22px 1fr 36px;
    gap: 9px;
    align-items: center;
}

.note-editor-check-row input[type="checkbox"] {
    width: 18px;
    height: 18px;
}

.note-editor-check-row input[type="text"] {
    min-height: 42px;
    background: rgba(255,255,255,.56) !important;
}

.note-editor-check-row button {
    width: 36px !important;
    min-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
    padding: 0 !important;
    border-radius: 50% !important;
    background: rgba(255,255,255,.60) !important;
    color: #8d625f !important;
}

.note-add-image-button {
    min-height: 50px;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    border: 1px dashed #c89ca1 !important;
    background: rgba(255,255,255,.56) !important;
    color: #835e61 !important;
}

.note-add-image-button > span {
    font-size: 19px;
}

#editorImagePreview figure {
    position: relative;
    margin: 15px 0 0;
    overflow: hidden;
    border-radius: 14px;
}

#editorImagePreview img {
    width: 100%;
    max-height: 360px;
    display: block;
    object-fit: cover;
}

#editorImagePreview button {
    position: absolute;
    top: 10px;
    right: 10px;
    background: rgba(54,45,40,.78) !important;
    color: #fff !important;
}

.modal-open {
    overflow: hidden;
}

@media (max-width: 1100px) {
    .notes-toolbar {
        grid-template-columns: 1fr 1fr;
    }

    .note-editor-layout {
        grid-template-columns: 250px minmax(0, 1fr);
    }
}

@media (max-width: 820px) {
    .notes-board-heading,
    .notes-category-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .notes-board-heading > p {
        text-align: left;
    }

    .notes-category-actions {
        width: 100%;
    }

    .notes-category-add {
        flex: 1;
    }

    .note-editor-dialog {
        inset: 0;
        border-radius: 0;
    }

    .note-editor-header {
        align-items: flex-start;
    }

    .note-editor-layout {
        display: block;
        overflow-y: auto;
    }

    .note-editor-sidebar {
        overflow: visible;
        border-right: 0;
        border-bottom: 1px solid #eadfd8;
    }

    .note-paper-wrap {
        overflow: visible;
    }

    .note-paper-preview {
        min-height: 680px;
    }
}

@media (max-width: 620px) {
    .notes-toolbar {
        grid-template-columns: 1fr;
    }

    .notes-board-shell {
        padding: 18px;
        border-width: 8px;
    }

    .notes-category-card {
        padding: 17px !important;
    }

    .notes-grid {
        grid-template-columns: 1fr;
    }

    .note-card {
        min-height: 210px !important;
    }

    .note-editor-header {
        position: sticky;
        top: 0;
        z-index: 20;
        flex-direction: column;
    }

    .note-editor-header-actions {
        width: 100%;
    }

    .note-editor-header-actions button {
        flex: 1;
    }

    .note-paper-wrap {
        padding: 14px;
    }

    .note-paper-preview {
        min-height: 620px;
        padding: 48px 22px 36px;
        border-radius: 12px;
    }

    .note-paper-heart {
        top: 27px;
        right: 23px;
    }

    #editorPaperTitle {
        width: calc(100% - 45px) !important;
        font-size: 32px;
    }

    .note-editor-extra-grid {
        grid-template-columns: 1fr;
    }
}

/* ==========================================================
   ZAPISKI — RAVNA POSTAVITEV LISTKOV BREZ SKUPIN
   Ta blok dodaj NA KONEC style.css, za prejšnji CSS za zapiske.
========================================================== */

.notes-page .notes-toolbar {
    grid-template-columns: minmax(260px, 1fr) auto auto;
}

.notes-page .notes-board-shell {
    background:
        radial-gradient(
            circle at 20% 10%,
            rgba(255, 255, 255, .92),
            transparent 34%
        ),
        linear-gradient(135deg, #f6f1ec, #eee6de);

    border: 1px solid #e4d8cf;

    box-shadow:
        0 22px 55px rgba(73, 48, 32, .10);
}

.notes-page .notes-board-shell::before {
    display: none;
}

.notes-page .notes-board-shell::after {
    inset: 18px;
    border: 1px solid rgba(166, 139, 119, .14);
}

.notes-page .notes-board-heading h2 {
    color: #4b4039;
    text-shadow: none;
}

.notes-page .notes-board-heading .page-kicker,
.notes-page .notes-board-heading > p {
    color: #8a786d !important;
}

.notes-board-grid {
    position: relative;
    z-index: 2;

    display: grid;

    grid-template-columns:
        repeat(4, minmax(190px, 1fr));

    gap: 38px 28px;
    align-items: start;
}

.notes-board-grid .note-card {
    min-height: 260px !important;
    padding: 34px 24px 24px !important;

    border-radius:
        1px 1px 6px 1px !important;

    box-shadow:
        0 5px 7px rgba(65, 47, 35, .08),
        0 18px 26px rgba(65, 47, 35, .16) !important;
}

.notes-board-grid .note-card::after {
    content: "♡";

    position: absolute;
    right: 17px;
    bottom: 13px;

    color: rgba(185, 104, 119, .58);

    font:
        600 30px
        "Caveat",
        cursive;

    transform: rotate(-8deg);
    pointer-events: none;
}

.notes-board-grid .note-card:nth-child(4n + 2)::after {
    content: "☀";
    color: rgba(217, 160, 45, .70);
}

.notes-board-grid .note-card:nth-child(4n + 3)::after {
    content: "♡";
    color: rgba(133, 107, 190, .58);
}

.notes-board-grid .note-card:nth-child(4n + 4)::after {
    content: "☆";
    color: rgba(71, 153, 204, .68);
}

.notes-board-grid .note-card-tape {
    top: -13px;
    width: 86px;
    height: 27px;
}

.notes-board-grid
.note-card:nth-child(4n + 2)
.note-card-tape {
    background:
        radial-gradient(
            circle,
            rgba(255, 255, 255, .78) 0 2px,
            transparent 2.5px
        ),
        rgba(247, 205, 94, .72);

    background-size: 15px 15px;
}

.notes-board-grid
.note-card:nth-child(4n + 3)
.note-card-tape {
    background:
        linear-gradient(
            90deg,
            rgba(255, 255, 255, .24) 1px,
            transparent 1px
        ),
        linear-gradient(
            rgba(255, 255, 255, .24) 1px,
            transparent 1px
        ),
        rgba(188, 163, 218, .68);

    background-size: 9px 9px;
}

.notes-board-grid
.note-card:nth-child(4n + 4)
.note-card-tape {
    background: rgba(233, 197, 165, .75);
}

.notes-board-grid .note-card-copy {
    min-height: 180px;
}

.notes-board-grid .note-card h4 {
    margin: 8px 0 0;
    padding-bottom: 10px;

    border-bottom:
        2px solid rgba(177, 117, 117, .24);

    font-size:
        clamp(24px, 2.1vw, 31px);

    text-align: center;
}

.notes-board-grid .note-card-preview {
    margin-top: 18px;

    -webkit-line-clamp: 6;

    color: #544842;
    font-size: 13px;
    line-height: 1.7;
}

.note-card-list-preview {
    margin: 18px 0 0;
    padding-left: 20px;

    display: grid;
    gap: 6px;

    color: #544842;
    font-family: var(--note-font);
    font-size: 13px;
    line-height: 1.55;
}

.note-card-list-preview .done {
    opacity: .55;
    text-decoration: line-through;
}

.note-card-empty-hint {
    margin: 24px 0 0;

    color: rgba(83, 68, 60, .44);

    font-size: 12px;
    text-align: center;
}

.notes-board-grid .note-card-footer {
    position: relative;
    z-index: 3;
}

.note-card-add-flat {
    align-items: center;
    justify-content: center;

    text-align: center;

    border:
        2px dashed #cfb9aa !important;

    background:
        rgba(255, 255, 255, .56) !important;

    color: #79685d !important;

    box-shadow: none !important;
}

.note-card-add-flat::after {
    display: none;
}

.note-card-add-flat > span {
    width: 58px;
    height: 58px;

    margin-bottom: 13px;

    display: grid;
    place-items: center;

    border-radius: 50%;

    background: #efe4dc;

    font-size: 34px;
}

.note-card-add-flat strong {
    font-family:
        "Playfair Display",
        serif;

    font-size: 22px;
}

.note-card-add-flat small {
    margin-top: 5px;
    color: #99877b;
}

@media (max-width: 1180px) {
    .notes-board-grid {
        grid-template-columns:
            repeat(3, minmax(190px, 1fr));
    }
}

@media (max-width: 860px) {
    .notes-page .notes-toolbar {
        grid-template-columns: 1fr 1fr;
    }

    .notes-page .notes-search {
        grid-column: 1 / -1;
    }

    .notes-board-grid {
        grid-template-columns:
            repeat(2, minmax(180px, 1fr));
    }
}

@media (max-width: 560px) {
    .notes-page .notes-toolbar,
    .notes-board-grid {
        grid-template-columns: 1fr;
    }

    .notes-page .notes-search {
        grid-column: auto;
    }

    .notes-board-grid .note-card {
        min-height: 235px !important;
    }
}

/* ==========================================================
POPPINS GLOBAL FONT
========================================================== */

:root{
    --font-title: "Poppins", sans-serif;
    --font-subtitle: "Poppins", sans-serif;
    --font-body: "Poppins", sans-serif;
}

body,
button,
input,
select,
textarea,
label,
p,
span,
small,
li,
td,
th,
a{
    font-family:"Poppins",sans-serif !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
.top-logo,
.brand-mark,
.auth-logo,
.note-card h4,
#editorPaperTitle{
    font-family:"Poppins",sans-serif !important;
    font-style:normal !important;
    letter-spacing:-0.02em;
}

.page-hero h1{
    font-weight:700 !important;
}

h2{
    font-weight:600 !important;
}

h3,
h4{
    font-weight:600 !important;
}

.note-card{
    --note-font:"Poppins",sans-serif;
}

.note-paper-preview{
    --editor-note-font:"Poppins",sans-serif;
}

.note-rich-editor{
    font-family:"Poppins",sans-serif !important;
}

button{
    font-family:"Poppins",sans-serif !important;
    font-weight:500;
}

/* ===== RAČUN IN PONASTAVITEV GESLA ===== */
.auth-text-button { border: 0; background: transparent; font: inherit; color: #785f55; cursor: pointer; text-decoration: underline; margin-top: 4px; }
.auth-text-button:disabled { opacity: .55; cursor: wait; }
.auth-shell-single { grid-template-columns: minmax(320px, 560px); justify-content: center; }
.auth-back-link { display: inline-block; margin-top: 18px; color: #6f5a52; }
.account-sidebar-link { display: flex; gap: 10px; align-items: center; width: 100%; padding: 11px 14px; color: inherit; text-decoration: none; border-radius: 10px; margin-bottom: 6px; }
.account-sidebar-link:hover { background: rgba(255,255,255,.55); }
.account-page { min-height: 100vh; background: #f5f0e8; color: #332c29; font-family: "DM Sans", sans-serif; }
.account-shell { width: min(820px, calc(100% - 32px)); margin: 0 auto; padding: 56px 0; }
.account-back { color: #75635b; text-decoration: none; }
.account-heading { margin: 32px 0; }
.account-heading h1 { font-family: "Playfair Display", serif; font-size: clamp(2.3rem, 6vw, 4rem); margin: 6px 0; }
.account-card { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 26px; margin: 16px 0; background: #fffdf9; border: 1px solid #e4dbcf; border-radius: 18px; box-shadow: 0 12px 34px rgba(65,46,37,.07); }
.account-card h2 { margin: 0 0 7px; font-family: "Playfair Display", serif; }
.account-card p { margin: 0; color: #776861; line-height: 1.55; }
.account-danger { border-color: #e4c4bf; }
.button-danger { background: #8f3f3b; color: white; border: 1px solid #8f3f3b; }
.button-danger:hover { background: #783430; }
.delete-dialog { border: 0; border-radius: 20px; padding: 0; width: min(500px, calc(100% - 32px)); box-shadow: 0 26px 80px rgba(30,20,17,.28); }
.delete-dialog::backdrop { background: rgba(37,28,25,.55); backdrop-filter: blur(3px); }
.delete-dialog-card { position: relative; padding: 30px; }
.delete-dialog-card h2 { font-family: "Playfair Display", serif; font-size: 2rem; margin: 6px 0 10px; }
.delete-dialog-card input { width: 100%; box-sizing: border-box; margin-top: 14px; padding: 13px 14px; border: 1px solid #cfc2b7; border-radius: 10px; font: inherit; }
.dialog-close { position: absolute; right: 16px; top: 12px; border: 0; background: transparent; font-size: 1.7rem; cursor: pointer; }
.dialog-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 22px; }
@media (max-width: 650px) { .account-card { align-items: stretch; flex-direction: column; } .account-card .button { width: 100%; } }

/* =========================================================
   POROČNA LOKACIJA
   ========================================================= */

.venue-page .page-container{padding-top:18px!important;padding-bottom:72px!important}.venue-container{max-width:1500px}
.venue-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:22px}.venue-summary article{padding:22px;border:1px solid var(--app-line,#e5ddd6);border-radius:20px;background:rgba(255,255,255,.95);box-shadow:var(--app-shadow,0 14px 35px rgba(78,59,45,.06))}.venue-summary span{display:block;margin-bottom:8px;color:var(--app-muted,#80756d);font-size:13px}.venue-summary strong{font:600 clamp(23px,2.4vw,34px) "Playfair Display",Georgia,serif;color:var(--app-text,#342f2b)}
.venue-intro{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:20px;padding:26px 28px!important}.venue-intro h2{margin:4px 0 7px}.venue-intro p:last-child{max-width:820px;margin:0;color:var(--app-muted,#80756d);line-height:1.65}.venue-intro-actions{display:flex;gap:10px;flex:0 0 auto}.venue-intro-actions button:disabled{opacity:.45;cursor:not-allowed}
.venue-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:20px 0}.venue-filter-group{display:flex;gap:7px;flex-wrap:wrap}.venue-filter-group button{min-height:38px!important;padding:8px 14px!important;border:1px solid #dfd3ca!important;border-radius:999px!important;background:#fff!important;color:#655c56!important;box-shadow:none!important;font-size:12px!important}.venue-filter-group button.active{background:#342e2a!important;color:#fff!important;border-color:#342e2a!important}.venue-search{width:min(330px,100%);display:flex;align-items:center;gap:8px;padding:0 13px;border:1px solid #dfd5cd;border-radius:12px;background:#fff}.venue-search input{width:100%;border:0!important;background:transparent!important;box-shadow:none!important;padding:10px 0!important;outline:0}
.venue-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(325px,1fr));gap:18px}.venue-card{overflow:hidden;border:1px solid #e4d9d0;border-radius:23px;background:#fff;box-shadow:0 14px 36px rgba(69,52,42,.07);transition:.2s ease}.venue-card:hover{transform:translateY(-2px);box-shadow:0 19px 43px rgba(69,52,42,.10)}.venue-card-cover{position:relative;height:170px;display:grid;place-items:center;background:linear-gradient(135deg,#eee3db,#f8f3ef);background-size:cover;background-position:center}.venue-cover-icon{font:500 48px "Playfair Display",serif;color:#a28673}.venue-status{position:absolute;left:14px;top:14px;padding:6px 10px;border-radius:999px;background:rgba(255,255,255,.92);font-size:11px;font-weight:700;box-shadow:0 4px 15px rgba(0,0,0,.05)}.status-rezervirano{background:#e4eee7;color:#55745f}.status-ozji-izbor{background:#f4ead9;color:#8a6a3e}.status-odpovedano{background:#f4e3e1;color:#9a5f5a}.venue-card-edit{position:absolute;right:14px;top:14px;width:34px!important;height:34px!important;min-height:0!important;padding:0!important;border:0!important;border-radius:50%!important;background:rgba(255,255,255,.92)!important;color:#51473f!important;box-shadow:0 4px 15px rgba(0,0,0,.06)!important}.venue-card-body{padding:20px}.venue-card-title{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.venue-card-title h3{margin:0 0 4px;font-size:27px}.venue-card-title p{margin:0;color:#8a7f77;font-size:12px}.venue-stars{white-space:nowrap;color:#9b765e;font-size:11px}.venue-card-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:17px 0}.venue-card-facts span{padding:10px 7px;border-radius:11px;background:#f8f3ef;color:#81756d;font-size:10px;text-align:center}.venue-card-facts b{display:block;margin-bottom:2px;color:#433b36;font-size:14px}.venue-card-payment{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:14px 0;border-top:1px solid #eee5df;border-bottom:1px solid #eee5df}.venue-card-payment div{display:flex;justify-content:space-between;gap:6px;align-items:center}.venue-card-payment span{color:#8a7f77;font-size:11px}.venue-card-payment strong{font-size:12px}.venue-card-meta{display:flex;justify-content:space-between;gap:10px;margin:11px 0;color:#8a7f77;font-size:10px}.venue-card-progress{margin:12px 0}.venue-card-progress>div:first-child,.venue-question-progress>div:first-child{display:flex;justify-content:space-between;gap:10px;margin-bottom:6px;color:#786e67;font-size:11px}.venue-progress{height:6px;overflow:hidden;border-radius:999px;background:#eee8e3}.venue-progress i{display:block;height:100%;width:0;border-radius:inherit;background:#9a7a65;transition:width .25s ease}.venue-open-btn{width:100%;margin-top:6px;background:#342e2a!important}.venue-empty{grid-column:1/-1;padding:70px 25px;text-align:center;border:1px dashed #d9cbc0;border-radius:24px;background:rgba(255,255,255,.72)}.venue-empty>span{display:block;margin-bottom:9px;font-size:40px;color:#a18470}.venue-empty h3{margin:0 0 6px;font-size:29px}.venue-empty p{max-width:610px;margin:0 auto 18px;color:#887c74;line-height:1.6}
.venue-modal{position:fixed;inset:0;z-index:600;display:none}.venue-modal.open{display:block}.venue-modal-backdrop{position:absolute;inset:0;background:rgba(37,30,26,.55);backdrop-filter:blur(6px)}.venue-modal-dialog{position:absolute;inset:2.5vh 2.5vw 2.5vh auto;width:min(1120px,95vw);display:flex;flex-direction:column;overflow:hidden;border:1px solid #e2d8d0;border-radius:25px;background:#fbf8f5;box-shadow:0 40px 100px rgba(34,27,23,.30)}.venue-modal-header,.venue-modal-footer{padding:19px 24px;display:flex;align-items:center;justify-content:space-between;gap:18px;background:#fff}.venue-modal-header{border-bottom:1px solid #eae1da}.venue-modal-header h2{margin:3px 0 0;font-size:34px}.venue-close{width:40px!important;height:40px!important;min-height:0!important;padding:0!important;border:1px solid #e2d7cf!important;border-radius:50%!important;background:#fff!important;color:#4f4640!important;font-size:24px!important;box-shadow:none!important}.venue-tabs{display:flex;gap:6px;padding:10px 20px;overflow-x:auto;border-bottom:1px solid #e7ddd5;background:#fff}.venue-tabs button{flex:0 0 auto;min-height:36px!important;padding:7px 11px!important;border:0!important;border-radius:9px!important;background:transparent!important;color:#766b64!important;box-shadow:none!important;font-size:11px!important}.venue-tabs button.active{background:#efe5de!important;color:#4d423b!important}.venue-modal-body{padding:25px;overflow:auto}.venue-tab-panel{display:none}.venue-tab-panel.active{display:block}.venue-section-title{display:flex;justify-content:space-between;align-items:flex-start;gap:25px;margin-bottom:23px}.venue-section-title>div{display:flex;align-items:center;gap:11px}.venue-section-title span{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:#ede1d9;color:#8b6c59;font-size:11px;font-weight:700}.venue-section-title h3{margin:0;font-size:29px}.venue-section-title p{max-width:430px;margin:6px 0 0;color:#8b8078;font-size:12px;line-height:1.55;text-align:right}.venue-subtitle{margin:28px 0 13px;padding-bottom:8px;border-bottom:1px solid #e8ddd5;font:600 20px "Playfair Display",Georgia,serif}.venue-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px 16px}.venue-form-grid label{display:flex;flex-direction:column;gap:6px;color:#5c534d;font-size:11px;font-weight:700}.venue-form-grid input,.venue-form-grid select,.venue-form-grid textarea{width:100%;padding:11px 12px!important;border:1px solid #ded3cb!important;border-radius:10px!important;background:#fff!important;color:#443d38!important;box-shadow:none!important;font:400 13px "DM Sans",sans-serif!important}.venue-form-grid textarea{min-height:92px;resize:vertical}.venue-form-grid .venue-tall{min-height:155px}.venue-span-2{grid-column:1/-1}.venue-check-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.venue-check-grid label{display:flex;align-items:center;gap:9px;padding:12px;border:1px solid #e2d7cf;border-radius:12px;background:#fff;color:#5f554f;font-size:12px}.venue-check-grid input{width:auto}.venue-top-gap{margin-top:16px}.venue-finance-box{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:20px}.venue-finance-box div{padding:16px;border-radius:14px;background:#f1e9e3}.venue-finance-box span{display:block;margin-bottom:5px;color:#857970;font-size:10px}.venue-finance-box strong{font-size:17px}.venue-modal-footer{border-top:1px solid #e7ddd5}.venue-modal-footer>div{display:flex;gap:8px}.danger-soft{color:#9a5b55!important}.venue-muted{color:#8e837b;font-size:11px}
.venue-upload-box{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;padding:18px;border:1px dashed #d6c5b9;border-radius:15px;background:#fff}.venue-upload-box input{position:absolute;opacity:0;pointer-events:none}.venue-upload-box label{display:flex;flex-direction:column;gap:3px;cursor:pointer}.venue-upload-box label strong{font-size:13px}.venue-upload-box label span{color:#94877e;font-size:11px}.venue-document-list{display:grid;gap:9px;margin-top:16px}.venue-document{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;padding:12px;border:1px solid #e3d9d1;border-radius:12px;background:#fff}.venue-doc-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:9px;background:#efe6df;color:#806858;font-size:10px;font-weight:800}.venue-document div:nth-child(2){min-width:0}.venue-document strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}.venue-document small{color:#958980;font-size:10px}.venue-document>div:last-child{display:flex;gap:5px}.venue-document button{min-height:30px!important;padding:5px 9px!important;font-size:10px!important}.danger-link{background:#f4e8e5!important;color:#945d57!important}.venue-assets-empty{padding:35px;border:1px dashed #d8c9bf;border-radius:13px;color:#94877e;text-align:center;font-size:12px}.venue-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px;margin-top:16px}.venue-gallery figure{position:relative;overflow:hidden;margin:0;border:1px solid #e2d7cf;border-radius:13px;background:#fff}.venue-gallery img{width:100%;height:150px;display:block;object-fit:cover}.venue-gallery figure>button{position:absolute;right:7px;top:7px;width:28px!important;height:28px!important;min-height:0!important;padding:0!important;border:0!important;border-radius:50%!important;background:rgba(255,255,255,.93)!important;color:#5b4d45!important}.venue-gallery figcaption{display:flex;justify-content:space-between;align-items:center;gap:7px;padding:8px 9px;color:#7c7068;font-size:9px}.venue-gallery figcaption span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.venue-gallery figcaption button{min-height:26px!important;padding:4px 7px!important;background:#eee4dd!important;color:#755e50!important;font-size:8px!important;white-space:nowrap}
.venue-question-progress{padding:15px 16px;margin-bottom:16px;border-radius:13px;background:#f0e7e1}.venue-question-group{margin-bottom:10px;overflow:hidden;border:1px solid #e3d8d0;border-radius:13px;background:#fff}.venue-question-group-head{width:100%;display:flex!important;align-items:center!important;justify-content:space-between!important;padding:13px 15px!important;border:0!important;border-radius:0!important;background:#fff!important;color:#504742!important;box-shadow:none!important}.venue-question-group-head>span{display:flex;align-items:center;gap:10px}.venue-question-group-head b{font-size:9px;color:#9a7b67}.venue-question-group-head i{font-style:normal}.venue-question-group.collapsed .venue-question-list{display:none}.venue-question-group.collapsed .venue-question-group-head i{transform:rotate(180deg)}.venue-question-list{border-top:1px solid #eee5df}.venue-question{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(220px,.7fr);gap:12px;align-items:center;padding:11px 14px;border-bottom:1px solid #f0e9e4}.venue-question:last-child{border-bottom:0}.venue-question.done{background:#faf7f4}.venue-question-check{display:flex;gap:9px;align-items:flex-start;color:#5a514b;font-size:11px;line-height:1.4}.venue-question-check input{margin-top:2px}.venue-question.done .venue-question-check span{text-decoration:line-through;color:#958a82}.venue-question textarea{min-height:43px;padding:8px 9px;border:1px solid #e2d7cf;border-radius:8px;resize:vertical;font:400 10px "DM Sans",sans-serif}
.venue-compare-dialog{inset:4vh 3vw;width:min(1260px,94vw)}.venue-compare-select{margin-bottom:16px;padding:14px;border-radius:13px;background:#f0e7e1}.venue-compare-select p{margin:0 0 9px;font-size:11px;font-weight:700}.venue-compare-select>div{display:flex;flex-wrap:wrap;gap:8px 16px}.venue-compare-select label{font-size:11px}.venue-compare-wrap{overflow:auto;border:1px solid #dfd5cd;border-radius:14px;background:#fff}.venue-compare-table{width:100%;min-width:760px;border-collapse:collapse}.venue-compare-table th,.venue-compare-table td{padding:11px 12px;border-bottom:1px solid #eee7e1;border-right:1px solid #eee7e1;font-size:10px;text-align:left;vertical-align:top}.venue-compare-table thead th{position:sticky;top:0;background:#ede3dc;font-size:11px}.venue-compare-table tbody th{width:150px;background:#faf7f4;color:#756a63}.venue-compare-table tr:last-child th,.venue-compare-table tr:last-child td{border-bottom:0}
@media(max-width:1000px){.venue-summary{grid-template-columns:repeat(2,1fr)}.venue-intro{align-items:flex-start;flex-direction:column}.venue-check-grid{grid-template-columns:repeat(2,1fr)}.venue-question{grid-template-columns:1fr}.venue-section-title{flex-direction:column}.venue-section-title p{text-align:left}}
@media(max-width:720px){.venue-summary{grid-template-columns:1fr 1fr;gap:9px}.venue-summary article{padding:16px}.venue-toolbar{align-items:stretch;flex-direction:column}.venue-search{width:100%}.venue-grid{grid-template-columns:1fr}.venue-modal-dialog{inset:0;width:100vw;border-radius:0}.venue-modal-header,.venue-modal-footer{padding:14px 15px}.venue-modal-header h2{font-size:27px}.venue-tabs{padding:8px 10px}.venue-modal-body{padding:17px 14px}.venue-form-grid{grid-template-columns:1fr}.venue-span-2{grid-column:auto}.venue-check-grid{grid-template-columns:1fr}.venue-finance-box{grid-template-columns:1fr}.venue-upload-box{grid-template-columns:1fr}.venue-modal-footer{align-items:stretch;flex-direction:column-reverse}.venue-modal-footer>div{display:grid;grid-template-columns:1fr 1fr}.venue-section-title h3{font-size:25px}.venue-gallery{grid-template-columns:1fr 1fr}.venue-card-facts{grid-template-columns:repeat(3,1fr)}}
@media(max-width:430px){.venue-summary{grid-template-columns:1fr}.venue-gallery{grid-template-columns:1fr}.venue-intro-actions{width:100%;display:grid}.venue-modal-footer>div{grid-template-columns:1fr}}

/* =========================================================
   KLARA — DEKORACIJA + ZA NAJU
   Dodaj na KONEC obstoječega style.css
   ========================================================= */
.decor-container,.couple-container{padding-bottom:80px}
.decor-summary,.couple-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:22px}.decor-summary article,.couple-summary article{padding:20px 21px;border:1px solid var(--app-line,#e8dfd7);border-radius:18px;background:rgba(255,255,255,.9);box-shadow:0 12px 35px rgba(84,66,52,.05)}.decor-summary span,.couple-summary span{display:block;color:#8b8179;font-size:11px}.decor-summary strong,.couple-summary strong{display:block;margin-top:6px;font:600 28px "Playfair Display",serif;color:#413a35}
.decor-moodboard{padding:28px;margin-bottom:30px;display:grid;grid-template-columns:minmax(260px,.85fr) minmax(0,1.15fr);gap:34px;align-items:center;background:linear-gradient(135deg,#fff 0%,#f5ede7 100%)}.decor-moodboard h2,.couple-intro h2{margin:3px 0 8px;font-size:31px}.decor-moodboard p,.couple-intro p{color:#857a72;line-height:1.6}.decor-moodboard-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}.decor-moodboard-fields label,.decor-form-grid label,.couple-form-grid label{display:flex;flex-direction:column;gap:6px;color:#615750;font-size:11px;font-weight:700}.decor-moodboard-fields input,.decor-form-grid input,.decor-form-grid select,.decor-form-grid textarea,.couple-form-grid input,.couple-form-grid select,.couple-form-grid textarea,.couple-writing-grid textarea{padding:11px 12px;border:1px solid #ded3cb;border-radius:10px;background:#fff;color:#443d38;font:400 13px "DM Sans",sans-serif;box-shadow:none}.decor-toolbar{display:flex;align-items:end;justify-content:space-between;gap:20px;margin:26px 0 15px}.decor-toolbar h2{margin:2px 0 0;font-size:30px}.decor-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.decor-card{overflow:hidden;border:1px solid #e5dbd3;border-radius:19px;background:#fff;box-shadow:0 12px 35px rgba(67,53,43,.05);cursor:pointer;transition:.2s ease}.decor-card:hover{transform:translateY(-3px);box-shadow:0 18px 42px rgba(67,53,43,.09)}.decor-card-cover{height:155px;position:relative;display:grid;place-items:center;background:linear-gradient(145deg,#efe4dc,#f8f3ef);background-size:cover;background-position:center}.decor-card-cover>span{font-size:38px;color:#a88570}.decor-card-cover em{position:absolute;right:10px;top:10px;padding:6px 8px;border-radius:999px;background:rgba(255,255,255,.9);color:#725e51;font-size:9px;font-style:normal}.decor-card-body{padding:16px}.decor-card-body>p{margin:0 0 3px;color:#9a8d84;font-size:10px}.decor-card-body h3{margin:0 0 12px;font-size:23px}.decor-card-meta,.decor-card-bottom{display:flex;align-items:center;justify-content:space-between;gap:10px}.decor-card-meta{padding-bottom:12px;color:#8c8078;font-size:9px;border-bottom:1px solid #eee7e1}.decor-card-bottom{padding-top:12px}.decor-card-bottom strong{font-size:12px}.decor-card-bottom span{font-size:10px;color:#8d6f5b}
.decor-modal,.couple-modal{position:fixed;inset:0;z-index:650;display:none}.decor-modal.open,.couple-modal.open{display:block}.decor-modal-backdrop,.couple-modal-backdrop{position:absolute;inset:0;background:rgba(37,30,26,.55);backdrop-filter:blur(6px)}.decor-modal-dialog,.couple-modal-dialog{position:absolute;inset:3vh 3vw 3vh auto;width:min(970px,94vw);display:flex;flex-direction:column;overflow:hidden;border:1px solid #e2d8d0;border-radius:24px;background:#fbf8f5;box-shadow:0 40px 100px rgba(34,27,23,.30)}.decor-modal-header,.couple-modal-dialog>header,.decor-modal-footer,.couple-modal-dialog>footer{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 22px;background:#fff}.decor-modal-header,.couple-modal-dialog>header{border-bottom:1px solid #eae1da}.decor-modal-header h2,.couple-modal-dialog h2{margin:2px 0 0;font-size:32px}.decor-close,.couple-modal-dialog>header button{width:40px!important;height:40px!important;min-height:0!important;padding:0!important;border:1px solid #e2d7cf!important;border-radius:50%!important;background:#fff!important;color:#4f4640!important;font-size:23px!important;box-shadow:none!important}.decor-tabs{display:flex;gap:7px;padding:10px 18px;border-bottom:1px solid #e7ddd5;background:#fff}.decor-tabs button{min-height:34px!important;padding:7px 11px!important;border:0!important;border-radius:9px!important;background:transparent!important;color:#766b64!important;box-shadow:none!important;font-size:11px!important}.decor-tabs button.active{background:#efe5de!important;color:#4d423b!important}.decor-modal-body,.couple-modal-dialog>.couple-form-grid{padding:24px;overflow:auto}.decor-panel{display:none}.decor-panel.active{display:block}.decor-form-grid,.couple-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.decor-form-grid textarea,.couple-form-grid textarea{min-height:100px;resize:vertical}.decor-span-2,.couple-span-2{grid-column:1/-1}.decor-upload-box{position:relative;margin-top:18px;padding:18px;border:1px dashed #d6c5b9;border-radius:14px;background:#fff}.decor-upload-box input{position:absolute;opacity:0;inset:0;width:100%;height:100%;cursor:pointer}.decor-upload-box label{display:flex;flex-direction:column;gap:3px}.decor-upload-box label span{color:#94877e;font-size:10px}.decor-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(165px,1fr));gap:12px;margin-top:15px}.decor-gallery figure{overflow:hidden;margin:0;border:1px solid #e2d7cf;border-radius:12px;background:#fff}.decor-gallery img{width:100%;height:145px;object-fit:cover;display:block}.decor-gallery figcaption{display:flex;justify-content:space-between;align-items:center;gap:7px;padding:7px 8px;font-size:9px}.decor-gallery figcaption span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.decor-gallery figcaption button{min-height:25px!important;padding:4px 7px!important;font-size:8px!important}.decor-gallery-empty{grid-column:1/-1;padding:35px;border:1px dashed #d9cbc1;border-radius:12px;text-align:center;color:#968a81;font-size:11px}.decor-checklist{display:grid;grid-template-columns:1fr 1fr;gap:10px}.decor-checklist label{display:flex;align-items:center;gap:10px;padding:13px;border:1px solid #e3d8d0;border-radius:12px;background:#fff;color:#5e554f;font-size:11px}.decor-modal-footer,.couple-modal-dialog>footer{border-top:1px solid #e7ddd5}.decor-modal-footer>div,.couple-modal-dialog>footer>div{display:flex;gap:8px}
.couple-intro{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:27px;margin-bottom:23px}.couple-tabs-main{display:flex;gap:7px;margin-bottom:17px;padding:7px;border:1px solid #e5dbd3;border-radius:15px;background:#fff;overflow:auto}.couple-tabs-main button{flex:1;min-width:150px;min-height:38px!important;padding:8px 12px!important;border:0!important;border-radius:10px!important;background:transparent!important;color:#7b7068!important;box-shadow:none!important;font-size:11px!important}.couple-tabs-main button.active{background:#eee3dc!important;color:#4c423c!important}.couple-main-panel{display:none}.couple-main-panel.active{display:block}.couple-task-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.couple-task-card,.couple-add-card{min-height:185px;padding:18px;border:1px solid #e5dbd3;border-radius:18px;background:#fff;box-shadow:0 10px 30px rgba(69,53,42,.04);text-align:left}.couple-task-card{cursor:pointer}.couple-task-card.done{background:#f5f1ed}.couple-task-top{display:flex;align-items:center;justify-content:space-between;gap:10px}.couple-task-top span,.couple-task-top em{font-size:9px}.couple-task-top span{color:#8c7465;text-transform:uppercase;letter-spacing:.08em}.couple-task-top em{padding:5px 7px;border-radius:999px;background:#f0e6df;color:#826b5c;font-style:normal}.couple-task-card h3{margin:22px 0 5px;font-size:24px}.couple-task-card>p{margin:0;color:#998d84;font-size:10px}.couple-task-card>div:last-child{display:flex;justify-content:space-between;gap:12px;margin-top:24px;padding-top:12px;border-top:1px solid #eee6e0;color:#8d8179;font-size:9px}.couple-task-card>div:last-child span{max-width:70%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.couple-task-card b{color:#7d6252}.couple-add-card{display:flex;flex-direction:column;align-items:center;justify-content:center;border-style:dashed!important;color:#78675c!important;background:#faf7f4!important}.couple-add-card span{font-size:31px;font-weight:300}.couple-add-card strong{margin-top:4px;font-size:12px}.couple-add-card small{margin-top:4px;color:#9a8e86;font-size:9px}
.couple-talk-toolbar{display:flex;align-items:end;justify-content:space-between;gap:18px;margin:16px 0}.couple-talk-toolbar h2{margin:2px 0 0;font-size:29px}.couple-talk-toolbar select{min-width:220px;padding:10px 11px;border:1px solid #ded3cb;border-radius:10px;background:#fff}.couple-talk-group{margin-bottom:14px;overflow:hidden;border:1px solid #e3d8d0;border-radius:17px;background:#fff}.couple-talk-group>header{display:grid;grid-template-columns:220px 1fr;align-items:center;gap:20px;padding:17px 18px;background:#f4ece6}.couple-talk-group header p{margin:0;color:#705c50;font-size:11px;font-weight:700}.couple-talk-group header h3{margin:2px 0 0;font:500 13px "DM Sans",sans-serif;color:#9a8d84}.couple-progress{height:6px;border-radius:99px;background:#e6dad1;overflow:hidden}.couple-progress i{display:block;height:100%;border-radius:inherit;background:#a98772}.couple-talk-item{display:grid;grid-template-columns:minmax(250px,1.2fr) 160px minmax(230px,.8fr);gap:12px;align-items:center;padding:12px 15px;border-top:1px solid #eee7e1}.couple-talk-item.done{background:#faf7f4}.couple-talk-item>div{display:flex;align-items:flex-start;gap:9px}.couple-talk-dot{flex:0 0 auto;width:8px;height:8px;margin-top:5px;border-radius:50%;background:#d5c2b5}.couple-talk-item.done .couple-talk-dot{background:#95735d}.couple-talk-item p{margin:0;color:#594f49;font-size:11px;line-height:1.5}.couple-talk-item select,.couple-talk-item textarea{padding:8px 9px;border:1px solid #e0d5cd;border-radius:9px;background:#fff;font:400 10px "DM Sans",sans-serif}.couple-talk-item textarea{min-height:44px;resize:vertical}.couple-writing-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.couple-writing-grid article{padding:22px}.couple-writing-grid h2{margin:3px 0 13px;font-size:23px}.couple-writing-grid textarea{width:100%;min-height:145px;resize:vertical}.couple-modal-dialog{inset:8vh auto auto 50%;width:min(680px,92vw);transform:translateX(-50%)}
@media(max-width:1000px){.decor-summary,.couple-summary{grid-template-columns:1fr 1fr}.decor-grid,.couple-task-grid{grid-template-columns:1fr 1fr}.decor-moodboard{grid-template-columns:1fr}.couple-talk-item{grid-template-columns:1fr 160px}.couple-talk-item textarea{grid-column:1/-1}}
@media(max-width:720px){.decor-summary,.couple-summary{grid-template-columns:1fr 1fr}.decor-grid,.couple-task-grid,.couple-writing-grid{grid-template-columns:1fr}.decor-moodboard-fields,.decor-form-grid,.couple-form-grid,.decor-checklist{grid-template-columns:1fr}.decor-span-2,.couple-span-2{grid-column:auto}.decor-toolbar,.couple-intro,.couple-talk-toolbar{align-items:stretch;flex-direction:column}.decor-modal-dialog{inset:0;width:100vw;border-radius:0}.couple-talk-group>header{grid-template-columns:1fr}.couple-talk-item{grid-template-columns:1fr}.couple-talk-item textarea{grid-column:auto}.couple-talk-toolbar select{width:100%;min-width:0}}
@media(max-width:430px){.decor-summary,.couple-summary{grid-template-columns:1fr}.decor-gallery{grid-template-columns:1fr 1fr}}


/* ===== KAYANI: MERGED PLANNER COMPONENTS ===== */
:root {
  --background: #f8f5f1;
  --surface: rgba(255, 255, 255, 0.94);
  --surface-soft: #fcfaf8;
  --text: #292622;
  --muted: #817970;
  --line: #e9e1da;
  --accent: #b79a84;
  --accent-dark: #947762;
  --accent-soft: #efe4dc;
  --rose: #d9a995;
  --rose-soft: #f6e8e2;
  --green: #8da18b;
  --green-soft: #edf3ec;
  --danger: #a85f5f;
  --danger-soft: #f9eeee;
  --shadow: 0 18px 50px rgba(84, 66, 52, 0.08);
  --radius-lg: 24px;
  --radius-md: 16px;
  --radius-sm: 11px;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  min-width: 320px;
  background:
    radial-gradient(circle at 15% 10%, rgba(234, 219, 207, 0.36), transparent 26%),
    var(--background);
  color: var(--text);
  font-family: "DM Sans", sans-serif;
}

button,
input,
select,
textarea {
  font: inherit;
}

button {
  cursor: pointer;
}

.app-shell {
  min-height: 100vh;
}

.sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 20;
  display: flex;
  width: 260px;
  flex-direction: column;
  padding: 34px 22px 24px;
  border-right: 1px solid rgba(231, 222, 214, 0.9);
  background: rgba(255, 253, 250, 0.91);
  backdrop-filter: blur(18px);
}

.brand {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  margin: 0 12px 42px;
  color: var(--text);
  text-decoration: none;
}

.brand-mark {
  font-family: "Playfair Display", serif;
  font-size: 36px;
  font-style: italic;
  line-height: 1;
}

.brand-mark {
    font-family:"Playfair Display", Georgia, serif;
    font-size:43px;
    font-style:italic;
    line-height:1;
    color:var(--app-text);
}

.brand-subtitle {
  margin-top: 10px;
  color: #a08371;
  font-size: 10px;
  letter-spacing: 0.28em;
}

.sidebar-nav {
  display: grid;
  gap: 7px;
}

.nav-link {
  display: flex;
  align-items: center;
  gap: 13px;
  min-height: 48px;
  padding: 10px 13px;
  border-radius: 13px;
  color: #49433e;
  text-decoration: none;
  transition: 180ms ease;
}

.nav-link:hover {
  background: #f5eee9;
  transform: translateX(2px);
}

.nav-link.active {
  background: linear-gradient(135deg, #eadfd7, #f5eee9);
  box-shadow: inset 0 0 0 1px rgba(190, 156, 132, 0.14);
  color: #332c27;
  font-weight: 600;
}

.nav-icon {
  display: inline-grid;
  width: 25px;
  height: 25px;
  place-items: center;
  font-size: 18px;
}

.sidebar-quote {
  margin-top: auto;
  padding: 18px;
  border: 1px solid #efe5dd;
  border-radius: var(--radius-md);
  background: linear-gradient(145deg, #fbf5f0, #f4e8df);
  color: #71665e;
  font-size: 13px;
  line-height: 1.6;
}

.sidebar-quote span {
  color: var(--rose);
}

.sidebar-quote p {
  margin: 6px 0 0;
}

.logout-button {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 16px;
  padding: 13px 16px;
  border: 0;
  border-radius: 13px;
  background: transparent;
  color: #554d47;
}

.logout-button:hover {
  background: #f1e9e3;
}

.main-content {
  margin-left: 260px;
  padding: 42px clamp(24px, 4vw, 66px) 70px;
}

.topbar {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 25px;
}

.eyebrow,
.section-kicker {
  margin: 0 0 8px;
  color: #ad8b75;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.18em;
}

h1,
h2,
h3,
p {
  margin-top: 0;
}

h1,
h2 {
  font-family: "Playfair Display", serif;
}

h1 {
  margin-bottom: 8px;
  font-size: clamp(34px, 4vw, 52px);
  font-weight: 600;
}

h2 {
  margin-bottom: 0;
  font-size: 26px;
  font-weight: 600;
}

.page-description {
  margin-bottom: 0;
  color: var(--muted);
}

.topbar-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.button,
.icon-button,
.filter-button,
.entry-type-button,
.small-add-button {
  border: 0;
  transition: 180ms ease;
}

.button {
  display: inline-flex;
  min-height: 45px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 18px;
  border-radius: 12px;
  font-weight: 600;
}

.button:hover {
  transform: translateY(-1px);
}

.button-primary {
  background: linear-gradient(135deg, #b99b84, #9c7b64);
  color: white;
  box-shadow: 0 10px 24px rgba(151, 118, 94, 0.22);
}

.button-secondary {
  border: 1px solid #decfc4;
  background: rgba(255, 255, 255, 0.78);
  color: #675a51;
}

.button-danger {
  background: var(--danger-soft);
  color: var(--danger);
}

.summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 18px;
}

.summary-card,
.calendar-card,
.day-panel,
.tasks-card {
  border: 1px solid rgba(228, 218, 209, 0.88);
  background: var(--surface);
  box-shadow: var(--shadow);
}

.summary-card {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: end;
  gap: 1px 10px;
  padding: 20px;
  border-radius: var(--radius-md);
}

.summary-card strong {
  grid-row: span 2;
  font-family: "Playfair Display", serif;
  font-size: 36px;
  font-weight: 600;
}

.summary-card > span:last-child {
  color: var(--muted);
  font-size: 13px;
}

.summary-label {
  color: #9e806c;
  font-size: 13px;
  font-weight: 600;
}

.planner-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.75fr) minmax(300px, 0.75fr);
  gap: 18px;
  align-items: start;
}

.calendar-card,
.day-panel,
.tasks-card {
  border-radius: var(--radius-lg);
}

.calendar-card {
  padding: 25px;
}

.calendar-header,
.day-panel-header,
.tasks-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.calendar-controls {
  display: flex;
  gap: 8px;
}

.icon-button {
  min-height: 38px;
  padding: 0 13px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fffdfa;
  color: #665b53;
}

.icon-button:hover {
  border-color: #cdb8aa;
  background: #f9f3ef;
}

.icon-button.square {
  width: 38px;
  padding: 0;
  font-size: 23px;
}

.calendar-weekdays,
.calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
}

.calendar-weekdays {
  margin-top: 24px;
  color: #a0958c;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-align: center;
}

.calendar-weekdays span {
  padding: 10px 4px;
}

.calendar-grid {
  overflow: hidden;
  margin-top: 5px;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
  border-radius: 15px;
}

.calendar-day {
  position: relative;
  min-height: 112px;
  padding: 9px;
  border: 0;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.82);
  color: inherit;
  text-align: left;
}

.calendar-day:hover {
  z-index: 1;
  background: #fbf6f2;
  box-shadow: inset 0 0 0 1px rgba(183, 154, 132, 0.25);
}

.calendar-day.outside-month {
  background: #fbfaf9;
  color: #bbb3ad;
}

.calendar-day.selected {
  background: #f6ede7;
  box-shadow: inset 0 0 0 2px #b99a83;
}

.day-number {
  display: inline-grid;
  width: 29px;
  height: 29px;
  place-items: center;
  border-radius: 50%;
  font-size: 13px;
  font-weight: 600;
}

.calendar-day.today .day-number {
  background: var(--accent-dark);
  color: white;
}

.day-entry-list {
  display: grid;
  gap: 4px;
  margin-top: 5px;
}

.day-entry-pill {
  overflow: hidden;
  padding: 4px 6px;
  border-radius: 6px;
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.day-entry-pill.task {
  background: var(--accent-soft);
  color: #745b49;
}

.day-entry-pill.note {
  background: var(--rose-soft);
  color: #8d6051;
}

.day-entry-pill.completed {
  background: var(--green-soft);
  color: #61745f;
  text-decoration: line-through;
}

.more-indicator {
  color: var(--muted);
  font-size: 10px;
}

.calendar-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  margin-top: 17px;
  color: var(--muted);
  font-size: 12px;
}

.calendar-legend span {
  display: flex;
  align-items: center;
  gap: 7px;
}

.legend-dot {
  display: inline-block;
  width: 9px;
  height: 9px;
  border-radius: 50%;
}

.task-dot {
  background: var(--accent);
}

.note-dot {
  background: var(--rose);
}

.completed-dot {
  background: var(--green);
}

.day-panel {
  position: sticky;
  top: 22px;
  overflow: hidden;
}

.day-panel-header {
  padding: 25px 24px 19px;
  border-bottom: 1px solid var(--line);
}

.small-add-button {
  width: 39px;
  height: 39px;
  border-radius: 50%;
  background: var(--accent-soft);
  color: var(--accent-dark);
  font-size: 22px;
}

.small-add-button:hover {
  background: #e5d3c6;
  transform: rotate(4deg);
}

.day-panel-content {
  min-height: 440px;
  max-height: 650px;
  overflow-y: auto;
  padding: 17px;
}

.empty-state {
  display: grid;
  min-height: 350px;
  place-items: center;
  align-content: center;
  padding: 25px;
  color: var(--muted);
  text-align: center;
}

.empty-state h3 {
  margin: 10px 0 5px;
  color: #544b45;
}

.empty-state p {
  margin-bottom: 0;
}

.empty-icon {
  color: var(--rose);
  font-size: 30px;
}

.day-entry-card {
  margin-bottom: 10px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: var(--surface-soft);
}

.day-entry-card.task {
  border-left: 4px solid var(--accent);
}

.day-entry-card.note {
  border-left: 4px solid var(--rose);
}

.day-entry-card.completed {
  opacity: 0.68;
}

.day-entry-card-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.day-entry-type {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 5px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.day-entry-card h3 {
  margin-bottom: 4px;
  font-family: "DM Sans", sans-serif;
  font-size: 15px;
}

.day-entry-card p {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.55;
  white-space: pre-wrap;
}

.entry-actions {
  display: flex;
  gap: 5px;
}

.entry-action-button {
  padding: 5px 7px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: #988b82;
}

.entry-action-button:hover {
  background: #efe6df;
  color: #66574d;
}

.task-check {
  display: flex;
  gap: 10px;
  align-items: flex-start;
}

.task-check input {
  width: 18px;
  height: 18px;
  margin-top: 2px;
  accent-color: var(--green);
}

.meta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 9px;
}

.meta-tag {
  padding: 4px 7px;
  border-radius: 999px;
  background: #f1ebe6;
  color: #79685c;
  font-size: 10px;
}

.priority-high {
  background: #f9e8e5;
  color: #a65f57;
}

.priority-low {
  background: #edf3ec;
  color: #657a63;
}

.tasks-card {
  margin-top: 18px;
  padding: 25px;
}

.tasks-header {
  align-items: flex-end;
}

.filter-row {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.filter-button {
  min-height: 35px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: #73685f;
  font-size: 12px;
}

.filter-button:hover,
.filter-button.active {
  border-color: #cdb6a6;
  background: var(--accent-soft);
  color: #6d5341;
}

.task-list {
  display: grid;
  gap: 10px;
  margin-top: 20px;
}

.task-list-item {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 13px;
  align-items: center;
  padding: 15px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface-soft);
}

.task-list-item:hover {
  border-color: #d6c3b5;
  box-shadow: 0 8px 22px rgba(96, 73, 56, 0.06);
}

.task-list-item.completed {
  opacity: 0.64;
}

.task-list-item.completed .task-title {
  text-decoration: line-through;
}

.task-list-item input[type="checkbox"] {
  width: 19px;
  height: 19px;
  accent-color: var(--green);
}

.task-main {
  min-width: 0;
}

.task-title {
  margin-bottom: 5px;
  font-weight: 600;
}

.task-details {
  display: flex;
  flex-wrap: wrap;
  gap: 7px 12px;
  color: var(--muted);
  font-size: 12px;
}

.task-overdue {
  color: var(--danger);
  font-weight: 700;
}

.task-list-actions {
  display: flex;
  gap: 4px;
}

.list-empty {
  padding: 48px 20px;
  border: 1px dashed #dfd3ca;
  border-radius: 15px;
  color: var(--muted);
  text-align: center;
}

.modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 90;
  background: rgba(35, 28, 24, 0.34);
  backdrop-filter: blur(4px);
}

.modal {
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 100;
  width: min(610px, calc(100vw - 28px));
  max-height: calc(100vh - 32px);
  overflow-y: auto;
  transform: translate(-50%, -50%);
  padding: 26px;
  border: 1px solid #e7ddd5;
  border-radius: 22px;
  background: #fffdfb;
  box-shadow: 0 28px 90px rgba(47, 34, 27, 0.26);
}

.hidden {
  display: none !important;
}

.modal-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
}

.modal-close {
  width: 38px;
  height: 38px;
  border: 0;
  border-radius: 50%;
  background: #f5efeb;
  color: #71645b;
  font-size: 25px;
}

.entry-type-switch {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5px;
  margin: 22px 0;
  padding: 5px;
  border-radius: 13px;
  background: #f3ece7;
}

.entry-type-button {
  min-height: 39px;
  border-radius: 10px;
  background: transparent;
  color: #796b61;
  font-weight: 600;
}

.entry-type-button.active {
  background: white;
  color: #5d4e44;
  box-shadow: 0 5px 15px rgba(92, 70, 55, 0.08);
}

.form-group {
  display: grid;
  gap: 7px;
  margin-bottom: 15px;
}

.form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 13px;
}

label {
  color: #665a52;
  font-size: 13px;
  font-weight: 600;
}

input,
select,
textarea {
  width: 100%;
  border: 1px solid #ded3ca;
  border-radius: 11px;
  outline: none;
  background: white;
  color: var(--text);
}

input,
select {
  min-height: 45px;
  padding: 0 12px;
}

textarea {
  resize: vertical;
  padding: 12px;
}

input:focus,
select:focus,
textarea:focus {
  border-color: #b99a83;
  box-shadow: 0 0 0 3px rgba(185, 154, 131, 0.13);
}

.form-message {
  margin-bottom: 14px;
  padding: 10px 12px;
  border-radius: 10px;
  background: var(--danger-soft);
  color: var(--danger);
  font-size: 13px;
}

.modal-actions,
.modal-actions-right {
  display: flex;
  align-items: center;
  gap: 9px;
}

.modal-actions {
  justify-content: space-between;
  margin-top: 22px;
}

.modal-actions-right {
  margin-left: auto;
}

.toast {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 120;
  max-width: min(360px, calc(100vw - 48px));
  padding: 13px 17px;
  border-radius: 12px;
  background: #3e3834;
  color: white;
  box-shadow: 0 15px 40px rgba(32, 26, 23, 0.22);
  font-size: 13px;
}

@media (max-width: 1120px) {
  .summary-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .planner-layout {
    grid-template-columns: 1fr;
  }

  .day-panel {
    position: static;
  }

  .day-panel-content {
    min-height: 260px;
    max-height: none;
  }
}

@media (max-width: 820px) {
  .sidebar {
    position: static;
    width: 100%;
    padding: 20px;
  }

  .brand {
    margin-bottom: 20px;
  }

  .sidebar-nav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .sidebar-quote {
    display: none;
  }

  .logout-button {
    margin-top: 12px;
  }

  .main-content {
    margin-left: 0;
    padding: 28px 18px 55px;
  }

  .topbar,
  .tasks-header {
    align-items: flex-start;
    flex-direction: column;
  }

  .calendar-day {
    min-height: 95px;
    padding: 6px;
  }

  .day-entry-pill {
    padding: 3px 4px;
    font-size: 9px;
  }
}

@media (max-width: 590px) {
  .summary-grid {
    grid-template-columns: 1fr 1fr;
  }

  .topbar-actions,
  .topbar-actions .button {
    width: 100%;
  }

  .calendar-card,
  .tasks-card {
    padding: 17px;
  }

  .calendar-header {
    align-items: flex-start;
    flex-direction: column;
  }

  .calendar-controls {
    width: 100%;
  }

  #todayButton {
    flex: 1;
  }

  .calendar-day {
    min-height: 72px;
  }

  .day-entry-list {
    display: none;
  }

  .calendar-day.has-entry::after {
    position: absolute;
    right: 7px;
    bottom: 7px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--rose);
    content: "";
  }

  .form-row {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .modal-actions {
    align-items: stretch;
    flex-direction: column-reverse;
  }

  .modal-actions-right {
    width: 100%;
    margin-left: 0;
  }

  .modal-actions-right .button,
  .modal-actions > .button {
    flex: 1;
  }

  .task-list-item {
    grid-template-columns: auto 1fr;
  }

  .task-list-actions {
    grid-column: 2;
  }
}

/* ===== KLARA PLANNER SHARED SIDEBAR ===== */
.sidebar { overflow-y:auto; scrollbar-width:thin; scrollbar-color:#d4c3b7 transparent; }
.sidebar-brand { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.sidebar-brand .brand { margin-bottom:30px; }
.sidebar-bottom { margin-top:auto; }
.sidebar-close { display:none; width:38px; height:38px; min-height:38px; padding:0; border:0; border-radius:50%; background:#efe4dc; color:#292622; font-size:23px; }
.menu-toggle { display:none; position:fixed; top:17px; left:18px; z-index:240; width:46px; height:46px; padding:0; border:1px solid #e9e1da; border-radius:50%; background:white; align-items:center; justify-content:center; flex-direction:column; gap:5px; box-shadow:0 10px 25px rgba(70,52,40,.08); }
.menu-toggle span { width:18px; height:2px; border-radius:999px; background:#292622; }
.sidebar-overlay { position:fixed; inset:0; z-index:150; display:none; background:rgba(39,31,26,.38); backdrop-filter:blur(4px); }
@media(max-width:820px){
  .sidebar{position:fixed; width:min(310px,88vw); transform:translateX(-105%); transition:transform .28s ease; z-index:200;}
  .sidebar-open .sidebar{transform:translateX(0)}
  .sidebar-open .sidebar-overlay{display:block}
  .menu-toggle{display:flex}
  .sidebar-close{display:grid;place-items:center}
  .main-content{margin-left:0;padding-top:88px}
}

.wedding-welcome-card{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:18px;padding:22px 25px;border:1px solid #e6dbd2;border-radius:18px;background:linear-gradient(135deg,#fff,#f2e7df);box-shadow:var(--shadow)}.wedding-welcome-card h2{margin:0 0 6px}.wedding-welcome-card p{margin:0;color:var(--muted)}.wedding-date-badge{padding:12px 17px;border-radius:12px;background:#fff;color:var(--accent-dark);font-weight:700}.task-list-actions [data-list-delete]{color:#a85f5f}
/* ==========================================================
   FINALNA USKLADITEV PLANERJA Z OSTALIMI PODSTRANMI
========================================================== */
:root {
  --klara-sidebar-width: 268px;
  --klara-content-gutter: clamp(36px, 5vw, 72px);
  --klara-page-title-size: clamp(52px, 5.2vw, 72px);
  --klara-content-max: 1450px;
}

.sidebar {
  width: var(--klara-sidebar-width) !important;
}

.main-content {
  box-sizing: border-box !important;
  width: auto !important;
  max-width: none !important;
  margin-left: var(--klara-sidebar-width) !important;
  padding: 54px var(--klara-content-gutter) 72px !important;
}

.main-content > * {
  max-width: var(--klara-content-max);
}

.topbar {
  width: 100% !important;
  margin: 0 0 30px !important;
  align-items: flex-end !important;
}

.topbar h1 {
  margin: 8px 0 12px !important;
  font-family: var(--font-title, "Playfair Display", Georgia, serif) !important;
  font-size: var(--klara-page-title-size) !important;
  font-weight: 600 !important;
  line-height: 1.02 !important;
  letter-spacing: -0.035em !important;
}

.topbar .eyebrow,
.topbar .section-kicker {
  margin: 0 0 8px !important;
  font-family: var(--font-body, "DM Sans", Arial, sans-serif) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: .20em !important;
  text-transform: uppercase !important;
}

.topbar .page-description {
  max-width: 760px !important;
  margin: 0 !important;
  font-size: 17px !important;
  line-height: 1.65 !important;
}

@media (max-width: 820px) {
  :root {
    --klara-sidebar-width: 0px;
    --klara-content-gutter: 20px;
    --klara-page-title-size: clamp(44px, 12vw, 60px);
  }

  .main-content {
    margin-left: 0 !important;
    padding-top: 34px !important;
  }
}


/* ==========================================================
   PAMETNI POROČNI KONTROLNI SEZNAM
========================================================== */
.checklist-library-card {
  margin-top: 18px;
  padding: 25px;
  border: 1px solid rgba(228, 218, 209, 0.88);
  border-radius: var(--radius-lg);
  background: var(--surface);
  box-shadow: var(--shadow);
}
.checklist-library-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
}
.checklist-library-header > div:first-child { max-width: 760px; }
.checklist-library-header h2 { margin-bottom: 8px; }
.checklist-library-header p:last-child { margin: 0; color: var(--muted); line-height: 1.6; }
.checklist-library-actions { display: flex; flex-wrap: wrap; gap: 9px; }
.checklist-toolbar {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(190px, .45fr) minmax(190px, .45fr);
  gap: 10px;
  margin-top: 22px;
}
.checklist-search { position: relative; display: block; }
.checklist-search span { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); color: var(--muted); font-size: 19px; }
.checklist-search input { padding-left: 42px; }
.checklist-toolbar input,
.checklist-toolbar select { width: 100%; margin: 0; min-height: 46px; }
.checklist-status-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin: 14px 2px 10px;
  color: var(--muted);
  font-size: 12px;
}
.checklist-category-list { display: grid; gap: 9px; }
.checklist-category {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface-soft);
}
.checklist-category summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 15px 17px;
  cursor: pointer;
  list-style: none;
  user-select: none;
}
.checklist-category summary::-webkit-details-marker { display: none; }
.checklist-category summary::after { content: "⌄"; color: var(--accent-dark); font-size: 20px; transition: transform .2s ease; }
.checklist-category[open] summary::after { transform: rotate(180deg); }
.checklist-category summary > span:first-child { display: flex; align-items: baseline; gap: 10px; min-width: 0; }
.checklist-category summary strong { font-size: 15px; }
.checklist-category summary small { color: var(--muted); font-size: 11px; }
.checklist-category-count { margin-left: auto; padding: 4px 8px; border-radius: 999px; background: var(--accent-soft); color: var(--accent-dark); font-size: 11px; }
.checklist-items { display: grid; gap: 8px; padding: 0 10px 10px; }
.checklist-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  padding: 15px;
  border: 1px solid #eee5de;
  border-radius: 12px;
  background: white;
}
.checklist-item.added { background: #f7faf6; border-color: #dce8da; }
.checklist-item-title-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.checklist-item h3 { margin: 0; font-family: "DM Sans", sans-serif; font-size: 15px; font-weight: 700; }
.checklist-item p { margin: 6px 0 0; color: var(--muted); font-size: 12px; line-height: 1.55; }
.checklist-item-meta { display: flex; flex-wrap: wrap; gap: 7px 15px; margin-top: 8px; color: #9a8c82; font-size: 11px; }
.checklist-soon { color: var(--danger); font-weight: 700; }
.checklist-add-button {
  min-width: 142px;
  min-height: 39px;
  padding: 0 13px;
  border: 1px solid #d8c6b9;
  border-radius: 10px;
  background: white;
  color: var(--accent-dark);
  font-weight: 700;
  font-size: 12px;
}
.checklist-add-button:hover:not(:disabled) { background: var(--accent-soft); transform: translateY(-1px); }
.checklist-add-button.is-added { border-color: #cfe0cc; background: var(--green-soft); color: #61745f; cursor: default; }
.checklist-library-actions button:disabled { opacity: .55; cursor: wait; }

@media (max-width: 920px) {
  .checklist-library-header { align-items: flex-start; flex-direction: column; }
  .checklist-toolbar { grid-template-columns: 1fr 1fr; }
  .checklist-search { grid-column: 1 / -1; }
}
@media (max-width: 590px) {
  .checklist-library-card { padding: 17px; }
  .checklist-library-actions, .checklist-library-actions .button { width: 100%; }
  .checklist-toolbar { grid-template-columns: 1fr; }
  .checklist-search { grid-column: auto; }
  .checklist-status-row { align-items: flex-start; flex-direction: column; }
  .checklist-category summary > span:first-child { align-items: flex-start; flex-direction: column; gap: 3px; }
  .checklist-item { grid-template-columns: 1fr; }
  .checklist-add-button { width: 100%; }
}



/* ==========================================================
   KAYANI — FINAL GLOBAL LAYOUT / RESPONSIVE FIXES
   ========================================================== */
:root{
  --kayani-sidebar-width: 286px;
  --kayani-gutter: clamp(18px, 4vw, 62px);
}

/* Kazalo je na vseh velikostih zaslona skrito, dokler ga uporabnik ne odpre. */
.menu-toggle{
  display:flex !important;
  top:18px !important;
  left:18px !important;
  z-index:1002 !important;
}
.sidebar{
  width:min(var(--kayani-sidebar-width), 88vw) !important;
  z-index:1001 !important;
  transform:translateX(-106%) !important;
  transition:transform .28s ease !important;
  box-shadow:18px 0 50px rgba(55,43,35,.12) !important;
}
.sidebar-open .sidebar{ transform:translateX(0) !important; }
.sidebar-overlay{ z-index:1000 !important; }
.sidebar-open .sidebar-overlay{ display:block !important; }
.sidebar-close{ display:grid !important; place-items:center; }

/* Vsebina ni več trajno odmaknjena za sidebar. */
.page-hero,.page-container,.page-layout,.home-hero,.main-content,
body.app-page .main-content, body.planner-page .main-content,
.guests-page .page-hero,.guests-page .page-container{
  margin-left:0 !important;
}
.page-hero,.home-hero{ padding-left:var(--kayani-gutter) !important; padding-right:var(--kayani-gutter) !important; }
.page-container,.page-layout{ padding-left:var(--kayani-gutter) !important; padding-right:var(--kayani-gutter) !important; }
.main-content, body.app-page .main-content{
  width:100% !important;
  max-width:1600px !important;
  margin-right:auto !important;
  padding-left:clamp(20px,5vw,76px) !important;
  padding-right:clamp(20px,5vw,76px) !important;
}

/* Varni grid sistem: elementi se lahko skrčijo, ne prekrivajo sosedov. */
[class*="grid"], [class*="layout"]{ min-width:0; }
[class*="grid"] > *, [class*="layout"] > *{ min-width:0; max-width:100%; }
.summary-grid,.dashboard-grid,.stats-grid,.vendor-summary-grid,.payment-summary-grid,
.menu-summary-grid,.music-summary-grid,.photo-summary-grid,.gift-summary-grid,
.document-summary-grid,.todo-summary-grid,.feature-grid,.auth-feature-grid{
  grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr)) !important;
}
input,select,textarea,button{ max-width:100%; }
img,video,canvas,svg{ max-width:100%; }
.table-wrapper{ width:100%; overflow-x:auto !important; -webkit-overflow-scrolling:touch; }
table{ max-width:none; }

/* Planer: isti vizualni jezik kot druge podstrani. */
body.planner-page{
  background:#f8f5f1 !important;
  color:#2d2925 !important;
  font-family:"DM Sans",Arial,sans-serif !important;
}
body.planner-page .app-shell{ min-height:100vh; background:transparent !important; }
body.planner-page .main-content{ padding-top:54px !important; padding-bottom:72px !important; }
body.planner-page .topbar{
  padding:0 0 28px !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  align-items:flex-end;
  gap:24px;
}
body.planner-page .topbar h1{
  font-family:"Playfair Display",Georgia,serif !important;
  font-size:clamp(46px,6vw,76px) !important;
  line-height:1 !important;
  letter-spacing:-.035em !important;
  font-style:normal !important;
}
body.planner-page .eyebrow,body.planner-page .section-kicker{
  color:#a08371 !important;
  letter-spacing:.20em !important;
}
body.planner-page .wedding-welcome-card,
body.planner-page .summary-card,
body.planner-page .calendar-card,
body.planner-page .task-panel,
body.planner-page .task-list-card{
  border:1px solid #eadfd7 !important;
  border-radius:22px !important;
  background:rgba(255,253,250,.92) !important;
  box-shadow:0 16px 45px rgba(70,52,40,.055) !important;
}
body.planner-page .summary-grid{ grid-template-columns:repeat(auto-fit,minmax(180px,1fr)) !important; }
body.planner-page .planner-layout{ grid-template-columns:minmax(0,1.5fr) minmax(300px,.72fr) !important; gap:22px !important; }
body.planner-page .calendar-grid{ min-width:0; }
body.planner-page .calendar-day{ min-width:0; overflow:hidden; }

/* Sedežni red — obred: stolov in imen ne stiskamo v preozke stolpce. */
.guests-page .ceremony-layout-new{ grid-template-columns:minmax(0,1fr) 76px minmax(0,1fr) !important; overflow:hidden; }
.guests-page .ceremony-side{ min-width:0; overflow-x:auto; padding-bottom:8px; }
.guests-page .ceremony-seat-grid{
  display:grid !important;
  width:max-content;
  min-width:100%;
  grid-auto-columns:104px;
  justify-content:center;
}
.guests-page .ceremony-seat-grid .seating-seat{
  width:104px !important;
  min-width:104px !important;
  min-height:92px !important;
}
.guests-page .seat-guest-name{
  max-width:100px !important;
  min-height:31px;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
  overflow-wrap:break-word !important;
  word-break:normal !important;
}

/* Pogostitev — veliko prosto platno in vsak premični blok vsebuje celo mizo. */
.guests-page .dinner-room{
  width:100%;
  min-height:760px;
  overflow:auto !important;
  border-radius:22px;
}
.guests-page .dinner-room-canvas{
  position:relative !important;
  width:1800px !important;
  min-width:1800px !important;
  height:1200px !important;
  min-height:1200px !important;
  transform:none !important;
  zoom:var(--room-zoom, 1);
}
.guests-page .room-table-copy{
  position:absolute !important;
  box-sizing:border-box;
  cursor:grab;
  touch-action:none;
  user-select:none;
  overflow:visible !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
.guests-page .room-table-copy.dragging{ cursor:grabbing; z-index:50; }
.guests-page .room-table-copy.round{ width:540px !important; height:540px !important; }
.guests-page .room-table-copy.rect{ width:690px !important; height:450px !important; }
.guests-page .room-table-preview{
  position:absolute !important;
  inset:0 !important;
  margin:auto !important;
  max-width:none !important;
}
.guests-page .room-table-copy.round .room-table-preview{ width:520px !important; height:520px !important; }
.guests-page .room-table-copy.rect .room-table-preview{ width:660px !important; }
.guests-page .room-table-copy .dinner-seat{ z-index:8; }
.guests-page .room-table-menu{
  position:absolute !important;
  top:10px !important;
  right:10px !important;
  z-index:20 !important;
}

@media (max-width:1050px){
  body.planner-page .planner-layout{ grid-template-columns:1fr !important; }
}
@media (max-width:900px){
  .main-content,body.app-page .main-content{ padding-top:78px !important; }
  .guests-page .ceremony-layout-new{ grid-template-columns:1fr !important; }
  .guests-page .ceremony-aisle-new{ min-height:54px; }
}
@media (max-width:620px){
  :root{ --kayani-gutter:18px; }
  body.planner-page .topbar{ align-items:flex-start; flex-direction:column; }
  body.planner-page .topbar-actions{ width:100%; display:grid; grid-template-columns:1fr; }
  body.planner-page .summary-grid{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .guests-page .ceremony-layout-new{ padding:14px !important; }
}


/* =========================================================
   DEKLIŠČINA + PORTAL DRUŽIC
   ========================================================= */
.is-hidden{display:none!important}.bach-container{display:grid;gap:24px}.bach-intro-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:20px}.bach-card{min-height:280px;padding:34px;position:relative;overflow:hidden}.bach-card h2,.bach-settings h2,.bach-guests-note h2,.bach-invite-card h2{font-family:"Playfair Display",serif;font-size:clamp(1.65rem,3vw,2.3rem);margin:.2rem 0 .7rem}.bach-card-highlight{background:linear-gradient(135deg,#fffaf6,#f5ece5)}.bach-secret-card{background:linear-gradient(145deg,#25231f,#3c3731);color:#fff}.bach-secret-card .page-kicker,.bach-secret-card p{color:rgba(255,255,255,.72)}.bach-lock,.bach-card-icon{font-size:2rem;margin-bottom:18px}.bach-mini-points{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}.bach-mini-points span{background:rgba(255,255,255,.75);border:1px solid rgba(104,88,70,.12);border-radius:999px;padding:8px 11px;font-size:.84rem}.bach-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.bach-form-grid label,.bp-join label,.bp-modal-form label{display:grid;gap:7px;font-size:.86rem;font-weight:600}.bach-form-grid input,.bach-form-grid textarea,.bp-join input,.bp-modal-form input,.bp-modal-form textarea,.bp-modal-form select,.bp-message-form textarea{width:100%;border:1px solid #ded8d0;background:#fff;border-radius:12px;padding:12px 13px;font:inherit;box-sizing:border-box}.bach-form-grid textarea{min-height:105px;resize:vertical}.bach-span-2{grid-column:1/-1}.bach-settings,.bach-guests-note,.bach-invite-card{padding:30px}.section-heading-row{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:22px}.save-state,.bp-private-pill{font-size:.78rem;border-radius:999px;padding:7px 10px;background:#f1eee9;color:#766d63}.bach-guest-list{display:flex;flex-wrap:wrap;gap:9px;margin:18px 0}.bach-guest-chip{display:inline-flex;align-items:center;gap:8px;background:#f4efe9;border-radius:999px;padding:9px 12px}.bach-guest-chip button{border:0;background:transparent;font-size:1.1rem;cursor:pointer}.bach-add-row{display:flex;gap:10px}.bach-add-row input{flex:1;min-width:0}.bach-code-box{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:#f8f3ee;border:1px dashed #cbb8a6;border-radius:16px;padding:18px;margin:20px 0}.bach-code-box strong{font-size:1.5rem;letter-spacing:.18em}.bach-invite-actions{display:flex;gap:10px;flex-wrap:wrap}.button-link{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}.bach-security-note{margin-top:18px;font-size:.84rem;color:#756c63;max-width:780px}.empty-state{color:#928980;font-size:.9rem}

.bridesmaids-portal-page{min-height:100vh;background:#f7f3ee;color:#302c28;font-family:"DM Sans",sans-serif}.bp-topbar{height:78px;padding:0 clamp(20px,4vw,58px);display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #e5ddd5;background:rgba(255,255,255,.88);position:sticky;top:0;z-index:40;backdrop-filter:blur(12px)}.bp-top-actions{display:flex;align-items:center;gap:12px;font-size:.88rem}.bp-shell{max-width:1500px;margin:auto;padding:34px clamp(16px,3vw,44px) 70px}.bp-join{max-width:560px;margin:8vh auto;padding:42px;text-align:center}.bp-join h1,.bp-hero h1{font-family:"Playfair Display",serif;font-size:clamp(2.1rem,5vw,3.5rem);margin:.2rem 0 .8rem}.bp-join label{text-align:left;margin:16px 0}.bp-lock-badge{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:#efe4db;margin:0 auto 18px;font-size:1.4rem}.form-error{min-height:1.2em;color:#9a4d4d}.bp-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin:10px 0 26px}.bp-hero p{color:#776f68}.bp-hero-stats{display:grid;grid-template-columns:repeat(3,minmax(120px,1fr));gap:10px}.bp-hero-stats article{background:#fff;border:1px solid #e4ddd5;border-radius:16px;padding:16px}.bp-hero-stats span{display:block;font-size:.76rem;color:#8f867e}.bp-hero-stats strong{display:block;font-size:1.3rem;margin-top:5px}.bp-layout{display:grid;grid-template-columns:190px minmax(0,1fr);gap:22px;align-items:start}.bp-nav{padding:10px;position:sticky;top:98px;display:grid;gap:4px}.bp-nav button{border:0;background:transparent;color:#6e665f;padding:11px 12px;border-radius:10px;text-align:left;font:inherit;cursor:pointer;display:flex;gap:10px}.bp-nav button.active,.bp-nav button:hover{background:#eee5dd;color:#302c28}.bp-content,.bp-panel{min-width:0}.bp-panel{display:none}.bp-panel.active{display:block}.bp-panel>.panel,.bp-over-card,.bp-chat-card{padding:26px}.bp-overview-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.bp-over-card h2{font-family:"Playfair Display",serif;margin:.2rem 0 1rem}.bp-compact-list{display:grid;gap:9px}.bp-compact-list>div{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid #eee8e2;font-size:.86rem}.bp-mini-dot{width:9px;height:9px;border-radius:50%}.bp-mini-avatar{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#eee7df}.bp-bride-notes{display:grid;gap:12px}.bp-bride-notes div{background:#faf7f3;border-radius:12px;padding:12px}.bp-bride-notes p{margin:4px 0 0;color:#756d66;font-size:.88rem}.bp-money-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.bp-money-summary div{background:#faf7f3;border-radius:12px;padding:14px}.bp-money-summary span{display:block;color:#887f77;font-size:.74rem}.bp-money-summary strong{font-size:1rem;margin-top:4px;display:block}.bp-board,.bp-card-grid{display:grid;grid-template-columns:repeat(3,minmax(220px,1fr));gap:14px}.bp-item{border:1px solid #e2d9d0;border-top:4px solid #d4c5b8;background:#fff;border-radius:14px;padding:16px;min-width:0}.bp-item.is-done{opacity:.58}.bp-item.is-done h3{text-decoration:line-through}.bp-item-top{display:flex;align-items:center;gap:7px;font-size:.72rem;color:#887f76}.bp-kind-dot{width:8px;height:8px;border-radius:50%;background:currentColor}.bp-item-menu{margin-left:auto;border:0;background:transparent;cursor:pointer}.bp-item h3{margin:12px 0 7px;font-size:1rem}.bp-item p{color:#766e66;font-size:.86rem;white-space:pre-wrap}.bp-item-meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:13px}.bp-item-meta span{font-size:.73rem;background:#f7f4f0;border-radius:999px;padding:6px 8px}.bp-item-actions{display:flex;gap:7px;margin-top:13px}.bp-item-actions button{padding:7px 10px;font-size:.75rem}.bp-color-rose{--bp:#d7a7aa;border-top-color:#d7a7aa!important}.bp-color-sage{--bp:#9eb19a;border-top-color:#9eb19a!important}.bp-color-blue{--bp:#91a8ba;border-top-color:#91a8ba!important}.bp-color-lilac{--bp:#ad9cba;border-top-color:#ad9cba!important}.bp-color-sand{--bp:#c6b49f;border-top-color:#c6b49f!important}.bp-color-peach{--bp:#d9aa88;border-top-color:#d9aa88!important}.bp-mini-dot.bp-color-rose{background:#d7a7aa}.bp-mini-dot.bp-color-sage{background:#9eb19a}.bp-mini-dot.bp-color-blue{background:#91a8ba}.bp-mini-dot.bp-color-lilac{background:#ad9cba}.bp-mini-dot.bp-color-sand{background:#c6b49f}.bp-mini-dot.bp-color-peach{background:#d9aa88}.bp-timeline-list,.bp-schedule-list,.bp-money-list{display:grid;gap:10px}.bp-timeline-list .bp-item,.bp-schedule-list .bp-item,.bp-money-list .bp-item{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center}.bp-members-grid{display:grid;grid-template-columns:repeat(4,minmax(150px,1fr));gap:12px}.bp-member-card{background:#fff;border:1px solid #e7dfd7;border-top:3px solid var(--bp,#c6b49f);border-radius:14px;padding:14px;display:flex;align-items:center;gap:10px}.bp-avatar{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:#f0e9e3;font-weight:700}.bp-member-card span{display:block;font-size:.75rem;color:#8d847c}.bp-chat-card{min-height:620px;display:flex;flex-direction:column}.bp-messages{height:480px;overflow:auto;display:flex;flex-direction:column;gap:9px;padding:8px}.bp-message{max-width:72%;align-self:flex-start}.bp-message.mine{align-self:flex-end}.bp-message span{display:block;font-size:.68rem;color:#948b82;margin:0 6px 4px}.bp-message p{margin:0;background:#f1ebe5;padding:10px 13px;border-radius:14px 14px 14px 4px;white-space:pre-wrap}.bp-message.mine p{background:#ddd0c4;border-radius:14px 14px 4px 14px}.bp-message-form{display:flex;gap:9px;margin-top:auto;padding-top:15px;border-top:1px solid #eee6de}.bp-message-form textarea{resize:none}.bp-modal{position:fixed;inset:0;z-index:100}.bp-modal-backdrop{position:absolute;inset:0;background:rgba(30,27,24,.45);backdrop-filter:blur(2px)}.bp-modal-dialog{position:relative;z-index:1;width:min(600px,calc(100% - 28px));max-height:90vh;overflow:auto;margin:5vh auto;padding:26px}.bp-modal-dialog header{display:flex;justify-content:space-between;gap:20px}.bp-modal-dialog h2{font-family:"Playfair Display",serif;margin:.2rem 0}.bp-modal-close{border:0;background:transparent;font-size:1.8rem;cursor:pointer}.bp-modal-form{display:grid;gap:14px;margin-top:18px}.bp-form-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}.bp-modal-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:6px}
@media(max-width:1050px){.bp-layout{grid-template-columns:1fr}.bp-nav{position:static;display:flex;overflow-x:auto}.bp-nav button{flex:0 0 auto}.bp-board,.bp-card-grid{grid-template-columns:repeat(2,minmax(220px,1fr))}.bp-members-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.bach-intro-grid,.bach-form-grid,.bp-overview-grid{grid-template-columns:1fr}.bach-span-2{grid-column:auto}.bach-card,.bach-settings,.bach-guests-note,.bach-invite-card{padding:22px}.bp-topbar{height:68px}.bp-top-actions span{display:none}.bp-shell{padding-top:22px}.bp-hero{display:block}.bp-hero-stats{margin-top:16px;grid-template-columns:repeat(3,1fr)}.bp-board,.bp-card-grid,.bp-members-grid{grid-template-columns:1fr}.bp-form-2{grid-template-columns:1fr}.bp-message{max-width:88%}.bp-money-summary{grid-template-columns:1fr}.bp-join{padding:28px 20px;margin-top:4vh}.bach-add-row,.bp-message-form{flex-direction:column}}
@media(max-width:480px){.bp-hero-stats{grid-template-columns:1fr}.bp-topbar .brand-subtitle{display:none}.section-heading-row{display:block}.section-heading-row>button{margin-top:12px}}


/* ==========================================================
   KAYANI 2026 — FLUID GRID + REFINED PLANNER CALENDAR
   ========================================================== */
:root{
  --kayani-content-max: 1800px;
  --kayani-page-gutter: clamp(20px, 4vw, 64px);
}

/* Polna, uravnotežena širina podstrani, ker je navigacija sedaj overlay. */
body:not(.auth-page) > .page-hero,
body:not(.auth-page) > .page-container,
body:not(.auth-page) > .page-layout,
body:not(.auth-page) > .payment-container,
body:not(.auth-page) > .music-container,
body:not(.auth-page) > .menu-container,
body:not(.auth-page) > .photo-container,
body:not(.auth-page) > .gift-container,
body:not(.auth-page) > .document-container,
body:not(.auth-page) > .stats-container,
body:not(.auth-page) > .notes-container,
body:not(.auth-page) > .theme-container,
body:not(.auth-page) > .timeline-container,
body:not(.auth-page) > .seating-container,
body.app-page .main-content{
  box-sizing:border-box !important;
  width:100% !important;
  max-width:var(--kayani-content-max) !important;
  margin-left:auto !important;
  margin-right:auto !important;
  padding-left:var(--kayani-page-gutter) !important;
  padding-right:var(--kayani-page-gutter) !important;
}

body:not(.auth-page) > .page-hero{
  padding-top:54px !important;
  padding-bottom:30px !important;
}
body:not(.auth-page) > .page-container{
  padding-top:0 !important;
  padding-bottom:72px !important;
}
body:not(.auth-page) > .page-hero > *,
body:not(.auth-page) > .page-container > *,
body:not(.auth-page) > .page-layout > *,
body:not(.auth-page) > .payment-container > *,
body:not(.auth-page) > .music-container > *,
body:not(.auth-page) > .menu-container > *,
body:not(.auth-page) > .photo-container > *,
body:not(.auth-page) > .gift-container > *,
body:not(.auth-page) > .document-container > *,
body:not(.auth-page) > .stats-container > *,
body:not(.auth-page) > .notes-container > *,
body:not(.auth-page) > .theme-container > *,
body:not(.auth-page) > .timeline-container > *,
body:not(.auth-page) > .seating-container > *{
  width:100% !important;
  max-width:none !important;
  box-sizing:border-box;
}

/* Gridi naj zapolnijo razpoložljivo širino, ne da bi karkoli sililo iz zaslona. */
.personal-summary,
.summary-grid,
.dashboard-grid,
.stats-grid,
.vendor-summary-grid,
.payment-summary-grid,
.menu-summary-grid,
.music-summary-grid,
.photo-summary-grid,
.gift-summary-grid,
.document-summary-grid,
.todo-summary-grid,
.feature-grid{
  width:100%;
  grid-template-columns:repeat(auto-fit,minmax(min(230px,100%),1fr)) !important;
}
.personal-grid{
  width:100%;
  grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr)) !important;
}

/* PLANER — enaka Poppins tipografija kot preostanek aplikacije. */
body.planner-page,
body.planner-page button,
body.planner-page input,
body.planner-page select,
body.planner-page textarea,
body.planner-page h1,
body.planner-page h2,
body.planner-page h3,
body.planner-page h4,
body.planner-page .summary-card strong{
  font-family:"Poppins",sans-serif !important;
}
body.planner-page .main-content{
  max-width:var(--kayani-content-max) !important;
  margin-inline:auto !important;
  padding:54px var(--kayani-page-gutter) 80px !important;
}
body.planner-page .topbar h1{
  font-family:"Poppins",sans-serif !important;
  font-size:clamp(48px,5.4vw,76px) !important;
  font-weight:700 !important;
  line-height:1.02 !important;
  letter-spacing:-.045em !important;
}
body.planner-page .topbar{
  margin-bottom:28px;
}
body.planner-page .planner-layout{
  grid-template-columns:minmax(0,1fr) minmax(280px,360px) !important;
  gap:24px !important;
}

/* Koledar — lahek, eleganten mesečni pogled. */
body.planner-page .calendar-card{
  padding:clamp(18px,2.4vw,32px) !important;
  border:1px solid #e7ddd5 !important;
  border-radius:24px !important;
  background:rgba(255,255,255,.72) !important;
  box-shadow:0 14px 42px rgba(73,55,43,.055) !important;
  overflow:hidden;
}
body.planner-page .calendar-header{
  align-items:flex-end;
  margin-bottom:10px;
}
body.planner-page .calendar-header h2{
  font-size:clamp(28px,3vw,40px) !important;
  font-weight:600 !important;
  letter-spacing:-.035em;
}
body.planner-page .calendar-controls{
  gap:8px;
}
body.planner-page .calendar-controls .icon-button{
  min-height:42px;
  border:1px solid #e5d9d0 !important;
  border-radius:12px !important;
  background:#f7f0ea !important;
  color:#423b35 !important;
  font-weight:600;
  box-shadow:none !important;
}
body.planner-page .calendar-controls .icon-button:first-child{
  padding-inline:18px;
}
body.planner-page .calendar-controls .icon-button.square{
  width:42px;
  min-width:42px;
  padding:0;
}
body.planner-page .calendar-weekdays{
  margin-top:20px;
  margin-bottom:6px;
  color:#8f867e;
  font-size:10px;
  font-weight:700;
  letter-spacing:.14em;
}
body.planner-page .calendar-weekdays span{
  padding:10px 6px 12px;
}
body.planner-page .calendar-grid{
  margin-top:0 !important;
  border:1px solid #e8ded6 !important;
  border-radius:17px !important;
  background:#fffdfa;
  overflow:hidden !important;
}
body.planner-page .calendar-day{
  min-height:clamp(104px,9.2vw,142px) !important;
  padding:12px !important;
  border:0 !important;
  border-right:1px solid #ece3dc !important;
  border-bottom:1px solid #ece3dc !important;
  border-radius:0 !important;
  background:rgba(255,255,255,.78) !important;
  color:#2f2a26 !important;
  transition:background .16s ease, box-shadow .16s ease !important;
  overflow:hidden !important;
}
body.planner-page .calendar-day:nth-child(7n){ border-right:0 !important; }
body.planner-page .calendar-day:nth-last-child(-n+7){ border-bottom:0 !important; }
body.planner-page .calendar-day:hover{
  z-index:2;
  background:#fbf6f1 !important;
  box-shadow:inset 0 0 0 1px rgba(183,154,132,.25) !important;
}
body.planner-page .calendar-day.outside-month{
  background:#fbfaf8 !important;
  color:#aaa39d !important;
}
body.planner-page .calendar-day.selected{
  background:#f8f0ea !important;
  box-shadow:inset 0 0 0 2px #b99b84 !important;
}
body.planner-page .day-number{
  width:auto !important;
  height:auto !important;
  min-width:26px;
  min-height:26px;
  display:inline-flex !important;
  align-items:center;
  justify-content:flex-start;
  border-radius:9px !important;
  font-size:13px !important;
  font-weight:600 !important;
}
body.planner-page .calendar-day.sunday:not(.outside-month) .day-number{
  color:#a25e5d;
}
body.planner-page .calendar-day.today .day-number{
  min-width:28px;
  padding:3px 8px;
  justify-content:center;
  background:#302a26 !important;
  color:#fff !important;
}
body.planner-page .day-entry-list{
  display:grid;
  gap:5px;
  margin-top:8px;
}
body.planner-page .day-entry-pill{
  position:relative;
  display:block;
  width:100%;
  padding:7px 8px 7px 20px !important;
  border-radius:8px !important;
  font-size:10px !important;
  line-height:1.35;
  text-overflow:ellipsis;
  white-space:nowrap;
  box-sizing:border-box;
}
body.planner-page .day-entry-pill::before{
  content:"";
  position:absolute;
  left:8px;
  top:50%;
  width:6px;
  height:6px;
  border-radius:50%;
  transform:translateY(-50%);
  background:currentColor;
  opacity:.72;
}
body.planner-page .day-entry-pill.task{
  background:#f7e9df !important;
  color:#a36e4f !important;
}
body.planner-page .day-entry-pill.note{
  background:#f2e5e5 !important;
  color:#9b6666 !important;
}
body.planner-page .day-entry-pill.completed{
  background:#eaf0e6 !important;
  color:#6d8065 !important;
  text-decoration:none !important;
}
body.planner-page .calendar-legend{
  gap:10px;
  margin-top:16px;
}
body.planner-page .calendar-legend span{
  padding:7px 10px;
  border-radius:999px;
  background:#f8f3ef;
}

/* Desni panel naj ne sili koledarja v preozek stolpec. */
body.planner-page .day-panel{
  position:sticky;
  top:24px;
  min-width:0;
}

@media (max-width:1180px){
  body.planner-page .planner-layout{
    grid-template-columns:1fr !important;
  }
  body.planner-page .day-panel{ position:static; }
}
@media (max-width:760px){
  :root{ --kayani-page-gutter:18px; }
  body:not(.auth-page) > .page-hero{ padding-top:82px !important; }
  body.planner-page .main-content{ padding-top:82px !important; }
  body.planner-page .calendar-card{ padding:15px !important; overflow-x:auto; }
  body.planner-page .calendar-header{ align-items:flex-start; flex-direction:column; }
  body.planner-page .calendar-controls{ width:100%; }
  body.planner-page .calendar-controls .icon-button:first-child{ margin-right:auto; }
  body.planner-page .calendar-weekdays,
  body.planner-page .calendar-grid{ min-width:720px !important; }
  body.planner-page .calendar-day{ min-height:104px !important; }
}
@media (max-width:520px){
  body.planner-page .summary-grid{ grid-template-columns:1fr 1fr !important; }
  .personal-summary{ grid-template-columns:1fr 1fr !important; }
}


/* KAYANI — ločeni brezplačni profili za portale dekliščine/fantovščine */
.bp-auth-grid{max-width:980px;margin:5vh auto 34px;display:grid;grid-template-columns:1fr 1fr;gap:22px;}
.bp-auth-card{padding:clamp(24px,3vw,38px);display:grid;gap:13px;border-radius:26px;}
.bp-auth-card h1,.bp-auth-card h2{margin:0 0 4px;}
.bp-auth-card>p{margin:0 0 8px;color:var(--muted,#81786f);}
.bp-auth-card label{display:grid;gap:7px;font-size:13px;font-weight:600;}
.bp-auth-card input{width:100%;box-sizing:border-box;}
.bp-auth-card-soft{background:#f7f1ec;}
.bp-auth-note{font-size:12px!important;line-height:1.55;}
.bachelor-page .bach-card-highlight{background:linear-gradient(145deg,#fff,#f4eee8);}
.bachelor-page .bach-secret-card{background:linear-gradient(145deg,#f2ece5,#fff);}
@media(max-width:760px){.bp-auth-grid{grid-template-columns:1fr;margin-top:2vh}.bp-auth-card{padding:22px}.bachelor-page .page-hero{padding-top:82px!important;}}


/* =========================================================
   ENOTNA ZGORNJA ORODNA VRSTICA + IME UPORABNIKA
   ========================================================= */

}
.sidebar .brand-mark[data-user-name] {
  display: block;
  max-width: 185px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.account-profile-card { align-items: flex-start; }
.account-profile-copy { min-width: 220px; }
.account-profile-form {
  flex: 1;
  display: grid;
  grid-template-columns: minmax(150px, 1fr) minmax(150px, 1fr) auto;
  gap: 12px;
  align-items: end;
}
.account-profile-form label {
  display: grid;
  gap: 7px;
  font-size: 12px;
  font-weight: 700;
  color: #655a53;
}
.account-profile-form input {
  width: 100%;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid #ddd1c8;
  border-radius: 10px;
  background: #fff;
  font: inherit;
}

@media (max-width: 900px) {
  .planner-toolbar {
    left: 0;
    height: 64px;
    padding-left: 74px;
    padding-right: 20px;
    justify-content: flex-start;
  }
  .menu-toggle {
    top: 9px !important;
    left: 14px !important;
    z-index: 245 !important;
  }
  .account-profile-form { grid-template-columns: 1fr; width: 100%; }
}
@media (max-width: 620px) {
  .account-profile-card { display: grid; gap: 18px; }
}


/* =========================================================
   KAYANI V4 — UI POPRAVKI: BREZ HEADERJA, LAŽJI NASLOVI,
   PORTAL ZA PUNCE IN MINIMALISTIČNI SEDEŽI
   ========================================================= */

/* Stara zgornja orodna vrstica »POROČNI PLANER« je odstranjena. */
.planner-toolbar,
.planner-toolbar-title { display:none !important; }

/* Glavni naslovi podstrani niso več krepki. */
body:not(.auth-page) .page-hero h1,
body:not(.auth-page) .page-header h1,
body:not(.auth-page) .module-header h1,
body:not(.auth-page) .compact-hero h1 {
  font-weight: 400 !important;
  letter-spacing: -0.035em !important;
}

/* Čistejši share gumbi. */
.portal-share-actions {
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
}
.portal-share-actions > * { min-height:44px; }

/* ---------------- PORTAL ZA PUNCE ---------------- */
.bridesmaids-portal-page {
  background:
    radial-gradient(circle at 8% 0%, rgba(244,218,222,.56), transparent 30%),
    radial-gradient(circle at 92% 12%, rgba(239,225,214,.72), transparent 27%),
    #faf7f4 !important;
}
.bridesmaids-portal-page .bp-topbar {
  background:rgba(255,252,250,.86) !important;
  border-bottom:1px solid rgba(127,99,89,.10) !important;
  box-shadow:0 8px 30px rgba(83,60,50,.04);
}
.bridesmaids-portal-page .brand-mark { font-weight:500 !important; }
.bridesmaids-portal-page .brand-subtitle { letter-spacing:.16em; }
.girls-portal-welcome {
  max-width:720px;
  margin:18px auto 30px;
  text-align:center;
}
.girls-portal-heart {
  width:54px;height:54px;margin:0 auto 13px;
  display:grid;place-items:center;
  border-radius:50%;
  background:#f4e4e5;
  color:#9b6f74;
  font-size:27px;
}
.girls-portal-welcome h1 {
  margin:2px 0 8px;
  font-size:clamp(2.5rem,6vw,4.4rem);
  font-weight:400 !important;
}
.girls-portal-welcome > p:last-child {
  max-width:590px;margin:0 auto;color:#7c706a;line-height:1.7;
}
.bridesmaids-portal-page .bp-auth-grid { max-width:1040px; gap:18px; margin-top:0; }
.bridesmaids-portal-page .bp-auth-card {
  border:1px solid rgba(167,137,126,.14);
  box-shadow:0 20px 50px rgba(91,65,53,.07);
  background:rgba(255,255,255,.90);
}
.bridesmaids-portal-page .bp-auth-card-soft {
  background:linear-gradient(145deg,rgba(250,239,239,.96),rgba(255,252,249,.98));
}
.bridesmaids-portal-page .bp-auth-card h1,
.bridesmaids-portal-page .bp-auth-card h2,
.bridesmaids-portal-page .bp-join h1,
.bridesmaids-portal-page .bp-hero h1 { font-weight:400 !important; }
.bridesmaids-portal-page .bp-nav {
  border:1px solid rgba(158,126,115,.13);
  box-shadow:0 12px 32px rgba(75,53,44,.05);
  border-radius:20px;
}
.bridesmaids-portal-page .bp-nav button { border-radius:12px; }
.bridesmaids-portal-page .bp-nav button.active,
.bridesmaids-portal-page .bp-nav button:hover {
  background:#f3e3e4 !important;
  color:#6e5155 !important;
}
.bridesmaids-portal-page .bp-over-card,
.bridesmaids-portal-page .bp-chat-card,
.bridesmaids-portal-page .bp-panel > .panel {
  border:1px solid rgba(158,126,115,.12);
  box-shadow:0 14px 38px rgba(75,53,44,.055);
}

/* ---------------- SEDEŽNI RED ---------------- */
/* Stol je zdaj samo preprost zaobljen pravokotnik. */
.guests-page .chair-shape { display:none !important; }
.guests-page .seating-seat,
.guests-page .dinner-seat,
.guests-page .room-table-copy .dinner-seat {
  width:76px !important;
  min-width:76px !important;
  height:48px !important;
  min-height:48px !important;
  padding:6px 8px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  border:1px solid #ddd5cf !important;
  border-radius:12px !important;
  background:#fffdfa !important;
  box-shadow:0 4px 10px rgba(76,58,48,.045) !important;
  color:#8c817a !important;
  overflow:hidden !important;
}
.guests-page .seating-seat.occupied,
.guests-page .dinner-seat.occupied,
.guests-page .room-table-copy .dinner-seat.occupied {
  border-color:#bda99d !important;
  background:#f4ece6 !important;
  color:#4b413b !important;
}
.guests-page .seating-seat:hover,
.guests-page .dinner-seat:hover {
  transform:translateY(-1px);
  border-color:#bca99d !important;
  box-shadow:0 7px 15px rgba(76,58,48,.08) !important;
}
.guests-page .round-table-area .dinner-seat {
  width:76px !important;
  min-width:76px !important;
  height:48px !important;
  min-height:48px !important;
  transform:translate(-50%,-50%) !important;
}
.guests-page .rect-table-area .dinner-seat {
  flex:0 0 76px !important;
  width:76px !important;
  min-width:76px !important;
  height:48px !important;
  min-height:48px !important;
}
.guests-page .seat-guest-name {
  display:block !important;
  width:100%;
  margin:0 !important;
  color:inherit !important;
  font-size:11px !important;
  font-weight:500 !important;
  line-height:1.15 !important;
  text-align:center;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
.guests-page .seat-code { display:none !important; }
.guests-page .ceremony-seat-grid { gap:10px !important; }
.guests-page .ceremony-side h3 { font-weight:400 !important; }

/* Pri pravokotnih mizah manjši sedeži pustijo več zraka. */
.guests-page .rect-table-area {
  grid-template-columns:92px minmax(280px,1fr) 92px !important;
  grid-template-rows:82px 176px 82px !important;
  gap:10px !important;
}

@media (max-width:760px) {
  .girls-portal-welcome { margin-top:8px; padding:0 12px; }
  .bridesmaids-portal-page .bp-topbar { height:66px; }
  .portal-share-actions { display:grid; grid-template-columns:1fr; }
  .portal-share-actions > * { width:100%; justify-content:center; }
}