/* =========================================================
   PYRMONT PASTRY SYSTEM
   PORTAL.CSS
   ========================================================= */


/* ---------------------------------------------------------
   ALGEMENE PANELEN
   --------------------------------------------------------- */

.panel {
    background: var(--paper);
    border: 1px solid var(--line);
    padding: clamp(1rem, 3vw, 2rem);
    margin: 1.5rem 0;
    border-radius: 6px;
}

.panel h2 {
    font-size: 1.9rem;
}

.panel label {
    display: block;
    margin: .7rem 0;
}

.panel a {
    text-decoration: underline;
    text-underline-offset: 3px;
}


/* ---------------------------------------------------------
   ALGEMENE FORMULIEREN
   --------------------------------------------------------- */

.field-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.check-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .2rem 1rem;
}

.check-grid label,
.panel label:has(input[type="checkbox"]) {
    display: block;
}

.panel input[type="checkbox"] {
    width: auto;
    margin-right: .5rem;
}

.form-stack input:focus,
.form-stack textarea:focus,
button:focus-visible,
a:focus-visible {
    outline: 3px solid #b98b46;
    outline-offset: 2px;
}


/* ---------------------------------------------------------
   BESTAANDE COMPONENTEN / INGREDIËNTEN
   --------------------------------------------------------- */

.ingredient-row {
    display: grid;
    grid-template-columns: 2fr 1fr 2fr auto;
    gap: .7rem;
    align-items: end;
    margin-bottom: .6rem;
}

.ingredient-row button {
    margin-bottom: .7rem;
}

.small {
    font-size: .75rem;
    padding: .55rem .75rem;
}

.weight-total {
    font-weight: 700;
    font-size: 1.2rem;
    margin-top: 1rem;
}

.weight-total small {
    font-weight: 400;
    font-size: .85rem;
}


/* ---------------------------------------------------------
   TABELLEN
   --------------------------------------------------------- */

.table-scroll {
    overflow-x: auto;
}

.table-scroll table {
    min-width: 580px;
}

.table-scroll td:last-child,
.table-scroll th:last-child {
    text-align: left;
}


/* ---------------------------------------------------------
   ACTIES
   --------------------------------------------------------- */

.inline-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
}

.inline-actions button {
    font-size: .72rem;
    padding: .55rem;
}


/* ---------------------------------------------------------
   TEKST / RECEPTWEERGAVE
   --------------------------------------------------------- */

.prose {
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    line-height: 1.8;
}

.recipe-title {
    display: grid;
    grid-template-columns: 1.3fr 1fr;
    align-items: center;
    gap: 2rem;
}

.recipe-title h1 {
    font-size: clamp(2rem, 4vw, 4rem);
}

.recipe-cover {
    width: 100%;
    max-height: 370px;
    object-fit: contain;
    background: #ede4d6;
    border-radius: 6px;
}

.gallery-controls {
    position: absolute;
    left: clamp(1.5rem, 9vw, 10rem);
    bottom: 2rem;
    z-index: 3;
    display: flex;
    gap: .6rem;
}

.gallery-controls button {
    background: #173747bf;
    border: 1px solid #ffffff80;
    font-size: .7rem;
}

.topbar nav form {
    margin: 0;
}

.hero-content {
    width: min(960px, 95%);
    padding-right: 2rem;
}

.brand img {
    filter: none;
}


/* =========================================================
   CENTRALE DEELRECEPT EDITOR
   component-edit.php
   ========================================================= */


/* De editorpagina vrijwel volledige browserbreedte geven */

main.portal-main.component-editor {
    width: calc(100vw - 50px) !important;
    max-width: 1900px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}


/* Oude component-editor styling uitschakelen op dit scherm */

main.portal-main.component-editor {
    background: transparent !important;
    border-left: 0 !important;
}


/* Complete formulier */

#component-edit-form {
    width: 100% !important;
    max-width: none !important;
}


/* Panelen binnen editor */

.component-editor .panel {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box;
    background: var(--paper);
    padding: 28px;
    margin: 22px 0;
}


/* Alle velden consistent */

.component-editor input,
.component-editor select,
.component-editor textarea {
    width: 100%;
    box-sizing: border-box;
    min-width: 0;
    font-size: 15px;
}

.component-editor input,
.component-editor select {
    min-height: 46px;
    padding: 9px 11px;
}

.component-editor textarea {
    padding: 10px 12px;
    line-height: 1.4;
}


/* =========================================================
   1. BASISGEGEVENS
   ========================================================= */

.edit-grid {
    display: grid !important;
    grid-template-columns:
        minmax(300px, 2fr)
        minmax(180px, 1fr)
        minmax(160px, 1fr)
        minmax(160px, 1fr) !important;

    gap: 16px;
    width: 100%;
}

.edit-grid .span-2 {
    grid-column: span 2;
}

.edit-grid label {
    margin: 0;
}


/* =========================================================
   SECTIEKOPPEN
   ========================================================= */

.edit-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    margin-bottom: 18px;
}

.edit-section-head h2 {
    margin: 0;
}

.edit-section-head .button {
    width: auto;
    flex: 0 0 auto;
}


/* =========================================================
   KOLOMKOPPEN
   ========================================================= */

.edit-table-head {
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #687676;
    margin-bottom: 7px;
}

.edit-row {
    margin-bottom: 10px;
}


/* =========================================================
   2. INGREDIËNTEN
   ========================================================= */

.ingredient-grid {
    display: grid !important;

    grid-template-columns:
        minmax(220px, 1.2fr)
        minmax(200px, 1fr)
        120px
        110px
        45px !important;

    gap: 12px;
    align-items: center;
    width: 100%;
}

#ingredient-list {
    width: 100%;
}


/* =========================================================
   3. GEKOPPELDE DEELRECEPTEN
   ========================================================= */

.reference-grid {
    display: grid !important;

    grid-template-columns:
        minmax(500px, 1fr)
        170px
        140px
        45px !important;

    gap: 12px;
    align-items: center;
    width: 100%;
}

#reference-list {
    width: 100%;
}


/* =========================================================
   4. WERKWIJZE
   ========================================================= */

.workflow-edit-grid {
    display: grid !important;

    grid-template-columns:
        55px
        minmax(420px, 3fr)
        120px
        140px
        180px
        minmax(360px, 2.5fr)
        45px !important;

    gap: 12px;
    align-items: start;
    width: 100%;
}


/* Handeling */

.workflow-edit-grid textarea[name="step_action[]"] {
    width: 100%;
    min-height: 86px;
    resize: vertical;
}


/* Kritisch punt/resultaat */

.workflow-edit-grid textarea[name="step_critical[]"] {
    width: 100%;
    min-height: 86px;
    resize: vertical;
}


/* Kleine velden */

.workflow-edit-grid input {
    width: 100%;
    min-height: 46px;
}


/* Stapnummer */

.step-number {
    min-height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;

    background: #e7ece9;
    border: 1px solid var(--line);
    border-radius: 4px;

    font-weight: 800;
}


/* =========================================================
   VERWIJDERKNOP
   ========================================================= */

.remove-row {
    width: 42px !important;
    height: 42px;
    min-height: 42px;

    padding: 0 !important;

    display: flex;
    align-items: center;
    justify-content: center;

    background: #cf644d;
    color: white;

    border: 0;
    border-radius: 3px;

    font-size: 20px;
    line-height: 1;

    cursor: pointer;
}

.remove-row:hover {
    background: #a64437;
    color: white;
}


/* =========================================================
   OPSLAANKNOP
   ========================================================= */

.editor-save {
    display: flex;
    justify-content: flex-end;
    width: 100%;
    margin: 28px 0 50px;
}

.editor-save button {
    width: auto;
    min-width: 240px;
    font-size: 15px;
    padding: 14px 26px;
}


/* =========================================================
   MELDINGEN
   ========================================================= */

.flash {
    padding: 14px 18px;
    margin: 18px 0;
    border-radius: 4px;
}

.flash.success {
    background: #e4efe7;
    border: 1px solid #9dbba5;
}

.flash.error {
    background: #f6dfda;
    border: 1px solid #d69789;
}


/* =========================================================
   LAPTOP / KLEINER SCHERM
   ========================================================= */

@media (max-width: 1450px) {

    main.portal-main.component-editor {
        width: calc(100vw - 30px) !important;
    }

    .workflow-edit-grid {
        min-width: 1350px;
    }

    #workflow-list {
        min-width: 1350px;
    }

    .component-editor .panel {
        overflow-x: auto;
    }
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1000px) {

    .edit-grid {
        grid-template-columns:
            1fr 1fr !important;
    }

    .edit-grid .span-2 {
        grid-column: span 2;
    }

    .ingredient-grid {
        min-width: 750px;
    }

    .reference-grid {
        min-width: 800px;
    }

    .edit-section-head {
        align-items: flex-start;
    }
}


/* =========================================================
   MOBIEL
   ========================================================= */

@media (max-width: 650px) {

    main.portal-main.component-editor {
        width: calc(100vw - 20px) !important;
    }

    .component-editor .panel {
        padding: 16px;
    }

    .edit-grid {
        grid-template-columns: 1fr !important;
    }

    .edit-grid .span-2 {
        grid-column: span 1;
    }

    .edit-section-head {
        flex-direction: column;
    }

    .edit-section-head .button {
        width: 100%;
    }

    .recipe-title {
        grid-template-columns: 1fr;
    }

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


/* =========================================================
   PRINT
   ========================================================= */

@media print {

    .topbar,
    footer,
    .recipe-filter,
    button,
    .panel > a,
    .gallery-controls {
        display: none !important;
    }

    body {
        background: white;
        color: black;
    }

    .portal-main {
        padding: 0;
        width: 100%;
        max-width: none;
    }

    .panel {
        border: 0;
        padding: .5rem 0;
        break-inside: avoid;
    }

    .recipe-cover {
        max-height: 140px;
    }

    .recipe-title h1 {
        font-size: 24pt;
    }

    table {
        font-size: 10pt;
    }

    .table-scroll {
        overflow: visible;
    }

    .table-scroll table {
        min-width: 0;
    }

    .prose {
        font-size: 11pt;
    }
}


/* =========================================================
   TOEGANKELIJKHEID
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

    html {
        scroll-behavior: auto;
    }

    * {
        transition: none !important;
    }
}


/* =========================================================
   PYRMONT PASTRY SYSTEM — RESORT PORTAL REFINEMENT v1
   Alleen schermweergave; print blijft onaangetast.
   ========================================================= */

@media screen {

    .component-editor .panel,
    .recipe-page .panel {
        background:
            rgba(255,253,248,.96);
    }

    .edit-section-head {
        margin-bottom: 1.2rem;
        padding-bottom: .8rem;
        border-bottom:
            1px solid rgba(216,205,189,.7);
    }

    .edit-section-head h2 {
        margin: 0;
    }

    .edit-table-head {
        padding:
            .45rem .25rem .6rem;
        color:
            var(--pyrmont-muted, #667675);
        font-size:
            .61rem;
        font-weight: 750;
        letter-spacing: .12em;
        text-transform: uppercase;
    }

    .edit-row {
        padding:
            .45rem .25rem;
        border-bottom:
            1px solid rgba(216,205,189,.55);
    }

    .edit-row:last-child {
        border-bottom: 0;
    }

    .step-number {
        border:
            1px solid #d7ccbc;
        border-radius: 999px;
        background:
            #f5efe5;
        color:
            #6d5a3a;
        font-family:
            Georgia,
            "Times New Roman",
            serif;
        font-size: .95rem;
        font-weight: 400;
    }

    .editor-save {
        position: sticky;
        bottom: 0;
        z-index: 4;
        margin:
            28px 0 24px;
        padding:
            14px 0;
        background:
            linear-gradient(
                180deg,
                rgba(243,237,227,0),
                rgba(243,237,227,.96) 28%
            );
    }

    .editor-save button {
        min-width: 250px;
        box-shadow:
            0 10px 26px rgba(168,77,58,.15);
    }

    .component-editor textarea {
        line-height: 1.55;
    }

    .component-editor .panel > p:first-of-type {
        color:
            #5b6c6b;
    }

    /* Foto's: galerie-achtig kader, passend bij resortwebsite */
    .panel img {
        border-radius: 1px;
    }

    .panel > div[style*="max-width:850px"] {
        padding: 14px;
        background:
            #eee5d8 !important;
        border-color:
            #d3c3ad !important;
        border-radius:
            1px !important;
    }

    /* Beheerstatus: rustiger dan productie-inhoud */
    .panel h2 + p {
        max-width: 90ch;
    }

    /* Kostprijs krijgt een zakelijke, discrete uitstraling */
    .panel table td:nth-last-child(-n+2),
    .panel table th:nth-last-child(-n+2) {
        font-variant-numeric:
            tabular-nums;
    }

    @media (max-width: 650px) {

        .editor-save {
            position: static;
            padding: 0;
            background: transparent;
        }

        .editor-save button {
            width: 100%;
            min-width: 0;
        }
    }
}


/* =========================================================
   PYRMONT PASTRY SYSTEM — RESORT PORTAL REFINEMENT v2
   Editor and operational refinements.
   ========================================================= */

@media screen {

    .component-editor .panel {
        overflow: visible;
    }

    .edit-section-head {
        align-items: center !important;
        margin-bottom: 1rem !important;
        padding-bottom: 1rem !important;
        border-bottom: 1px solid #d4c7b6 !important;
    }

    .edit-section-head h2 {
        margin: 0 !important;
    }

    .edit-table-head {
        padding: .7rem .45rem !important;
        border-top: 1px solid #d4c7b6 !important;
        border-bottom: 1px solid #d4c7b6 !important;
        background: #eee6da !important;
        color: #65726f !important;
        font-size: .59rem !important;
        letter-spacing: .13em !important;
        text-transform: uppercase !important;
    }

    .edit-row {
        margin-bottom: 0 !important;
        padding: .65rem .45rem !important;
        border-bottom: 1px solid #e2d9cd !important;
        background: rgba(255,255,255,.32) !important;
    }

    .edit-row:hover {
        background: rgba(176,140,89,.055) !important;
    }

    .step-number {
        min-height: 42px !important;
        width: 42px !important;
        border: 1px solid #cbbda9 !important;
        border-radius: 50% !important;
        background: #f2ebdf !important;
        color: #7d633d !important;
        font-family: Georgia, "Times New Roman", serif !important;
        font-size: .9rem !important;
        font-weight: 400 !important;
    }

    .editor-save {
        position: sticky !important;
        bottom: 0 !important;
        z-index: 6 !important;
        justify-content: flex-end !important;
        margin: 1.5rem 0 2rem !important;
        padding: 1.2rem 0 !important;
        background:
            linear-gradient(
                180deg,
                rgba(245,241,233,0),
                rgba(245,241,233,.96) 38%
            ) !important;
    }

    .editor-save button {
        min-width: 270px !important;
        min-height: 48px !important;
        background: var(--pyrmont-heritage, #0d3440) !important;
        box-shadow: none !important;
    }

    .editor-save button:hover {
        background: #1b4a54 !important;
    }

    .remove-row {
        width: 40px !important;
        height: 40px !important;
        min-height: 40px !important;
        border-radius: 0 !important;
        font-size: 18px !important;
    }

    @media (max-width: 1450px) {

        .component-editor .panel {
            overflow-x: auto !important;
        }
    }

    @media (max-width: 650px) {

        .edit-section-head {
            align-items: stretch !important;
        }

        .editor-save {
            position: static !important;
            padding: 0 !important;
            background: transparent !important;
        }

        .editor-save button {
            width: 100% !important;
            min-width: 0 !important;
        }
    }
}


/* =========================================================
   PYRMONT PASTRY SYSTEM - EDITOR / ADMIN POLISH v3
   ========================================================= */

@media screen {
    .component-editor .portal-heading {
        margin-bottom: 1.25rem !important;
    }

    .component-editor .panel {
        margin-bottom: 1rem !important;
    }

    .component-editor .edit-section-head .button {
        background: transparent !important;
        border: 1px solid #0c3540 !important;
        color: #0c3540 !important;
    }

    .component-editor .edit-section-head .button:hover {
        background: #0c3540 !important;
        color: white !important;
    }

    .component-editor .editor-save button {
        background: #0c3540 !important;
        color: #fff !important;
    }
}


/* =========================================================
   ACCESS MANAGEMENT - PORTAL EXTENSIONS v1
   ========================================================= */

@media screen {
    .access-admin .panel {
        margin-bottom: 1.1rem !important;
    }

    .access-admin .portal-heading h1 {
        max-width: 18ch !important;
    }

    .access-admin .inline-actions button {
        min-height: 34px !important;
    }
}


@media screen {
    .access-admin .access-mail-status h2 {
        margin-bottom:.45rem !important;
    }
}


/* Premium workflow editor alignment */
@media screen {
    .component-editor .panel:has(#workflow-list) {
        overflow: visible !important;
    }
}


/* =========================================================
   GECOMBINEERDE EDITOR v1
   Geen oude brede tabelmodus voor de nieuwe productiekaarten.
   ========================================================= */

.component-editor #workflow-list {
    min-width: 0 !important;
    width: 100% !important;
}

.component-editor .workflow-step-card {
    min-width: 0 !important;
    width: 100% !important;
}

.component-editor .component-photo-editor {
    display: grid;
    gap: 1rem;
}

.component-editor .component-edit-photo {
    display: block;
    width: min(100%, 520px);
    max-height: 360px;
    object-fit: contain;
    border: 1px solid var(--line);
    background: #f7f3eb;
}

.component-editor .component-photo-form {
    display: grid;
    gap: .8rem;
    max-width: 620px;
}

@media (max-width: 1450px) {
    .component-editor #workflow-list {
        min-width: 0 !important;
    }

    .component-editor .panel:has(#workflow-list) {
        overflow-x: visible !important;
    }
}
/* =========================================================
   PYRMONT PASTRY SYSTEM — MOBILE EDITOR RELEASE v1
   2026-10-01
   Editorvelden worden op telefoon gestapeld in plaats van
   als brede desktoptabellen buiten beeld te lopen.
   ========================================================= */

@media screen and (max-width: 760px) {

    main.portal-main.component-editor,
    main.portal-main.dessert-editor {
        width: calc(100% - 16px) !important;
        max-width: none !important;
        overflow: visible !important;
    }

    .component-editor .panel,
    .dessert-editor .panel {
        max-width: 100% !important;
        overflow-x: visible !important;
        padding: 1rem !important;
    }

    .edit-grid,
    .ingredient-grid,
    .reference-grid,
    .workflow-edit-grid,
    .step-row,
    .workflow-meta-grid,
    .field-grid,
    .recipe-form {
        width: 100% !important;
        min-width: 0 !important;
        grid-template-columns: 1fr !important;
        gap: .8rem !important;
    }

    .edit-grid .span-2,
    .recipe-form .wide,
    .workflow-equipment-field {
        grid-column: auto !important;
    }

    #ingredient-list,
    #reference-list,
    #workflow-list,
    .component-editor #workflow-list {
        width: 100% !important;
        min-width: 0 !important;
    }

    .edit-table-head {
        display: none !important;
    }

    .edit-row,
    .ingredient-grid,
    .reference-grid,
    .workflow-edit-grid {
        position: relative;
        margin-bottom: .9rem !important;
        padding: 1rem !important;
        border: 1px solid #d8cbbb !important;
        background: #fffdf8 !important;
    }

    .ingredient-grid > *,
    .reference-grid > *,
    .workflow-edit-grid > * {
        min-width: 0 !important;
        width: 100% !important;
    }

    .ingredient-grid input,
    .ingredient-grid select,
    .reference-grid input,
    .reference-grid select,
    .workflow-edit-grid input,
    .workflow-edit-grid select,
    .workflow-edit-grid textarea,
    .component-editor input,
    .component-editor select,
    .component-editor textarea {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        font-size: 16px !important;
    }

    .workflow-step-card {
        min-width: 0 !important;
        width: 100% !important;
        padding: 1rem !important;
    }

    .workflow-step-top {
        grid-template-columns: 42px minmax(0, 1fr) 42px !important;
        gap: .55rem !important;
    }

    .workflow-meta-grid {
        grid-template-columns: 1fr !important;
    }

    .workflow-action-field textarea,
    .workflow-critical-field textarea {
        min-height: 140px !important;
    }

    .remove-row {
        width: 44px !important;
        min-width: 44px !important;
        height: 44px !important;
        min-height: 44px !important;
        justify-self: end !important;
    }

    .edit-section-head {
        width: 100% !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: .7rem !important;
    }

    .edit-section-head .button,
    .edit-section-head button {
        width: 100% !important;
    }

    .check-grid {
        grid-template-columns: 1fr !important;
    }

    .editor-save,
    .component-editor .editor-save {
        position: sticky !important;
        bottom: max(0px, env(safe-area-inset-bottom)) !important;
        z-index: 20 !important;
        width: 100% !important;
        margin: 1rem 0 !important;
        padding: .65rem !important;
        background: rgba(247,243,235,.96) !important;
        border-top: 1px solid #d8cbbb;
        backdrop-filter: blur(8px);
    }

    .editor-save button {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 50px !important;
    }

    .component-photo-editor,
    .component-photo-form {
        width: 100% !important;
        max-width: 100% !important;
    }

    .component-edit-photo {
        width: 100% !important;
        max-height: 320px !important;
    }

    /* Als een klassiek admin-overzicht een brede tabel nodig heeft,
       wordt alleen de tabel horizontaal swipebaar. */
    .access-admin .panel,
    .access-requests-panel {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
    }

    .access-admin table,
    .access-requests-panel table {
        min-width: 760px !important;
    }
}


/* Pyrmont team navigation: scoped to signed-in header only. */
.topbar.pyrmont-team-topbar {
    display:grid!important;grid-template-columns:auto minmax(0,1fr)!important;
    align-items:center!important;gap:12px 28px!important;
    height:auto!important;min-height:0!important;padding:14px clamp(16px,4vw,64px) 0!important;
    background:#173747!important;border-bottom:1px solid rgba(189,151,96,.38)!important;
}
.topbar.pyrmont-team-topbar .pyrmont-brand-mark {display:grid!important;}
.topbar.pyrmont-team-topbar .pyrmont-brand-copy {display:flex!important;}
.topbar.pyrmont-team-topbar > .brand {grid-column:1;grid-row:1;width:auto!important;margin:0!important;}
.topbar.pyrmont-team-topbar > nav.pyrmont-team-navigation {
    display:contents!important;overflow:visible!important;
}
.topbar.pyrmont-team-topbar .pyrmont-primary-nav {
    grid-column:1 / -1;grid-row:2;display:flex;flex-wrap:wrap;align-items:stretch;
    justify-content:space-evenly;gap:4px 12px;border-top:1px solid rgba(255,255,255,.14);
    padding:6px 0 0;min-width:0;
}
.topbar.pyrmont-team-topbar .pyrmont-primary-nav > a {
    display:flex!important;flex:1 1 auto;align-items:center;justify-content:center;
    min-height:46px;padding:10px 12px!important;margin:0!important;
    color:#eef2ef!important;background:transparent!important;border:0!important;
    border-bottom:3px solid transparent!important;border-radius:0!important;
    font:600 .86rem/1.3 Inter,ui-sans-serif,system-ui,sans-serif!important;
    letter-spacing:.015em!important;text-transform:none!important;
    text-align:center;white-space:normal!important;overflow-wrap:normal!important;
    transition:color .2s,background .2s,border-color .2s;
}
.topbar.pyrmont-team-topbar .pyrmont-primary-nav > .admin-link {color:#e4c89e!important;}
.topbar.pyrmont-team-topbar .pyrmont-primary-nav > a:hover,
.topbar.pyrmont-team-topbar .pyrmont-primary-nav > a[aria-current="page"] {
    color:#f3d7ac!important;border-bottom-color:#bd9760!important;background:rgba(255,255,255,.045)!important;
}
.topbar.pyrmont-team-topbar .pyrmont-account-nav {
    grid-column:2;grid-row:1;display:flex;flex-wrap:wrap;justify-content:flex-end;
    align-items:center;gap:8px 12px;min-width:0;
}
.topbar.pyrmont-team-topbar .pyrmont-account-nav > a,
.topbar.pyrmont-team-topbar .pyrmont-account-nav > form:not(.language-form) > button {
    display:inline-flex!important;align-items:center;justify-content:center;
    min-height:44px!important;height:auto!important;padding:8px 12px!important;
    color:#f1f4f1!important;background:transparent!important;border:1px solid rgba(255,255,255,.2)!important;
    border-radius:6px!important;font:500 .8rem/1.3 Inter,ui-sans-serif,system-ui,sans-serif!important;
    letter-spacing:0!important;text-transform:none!important;white-space:normal!important;
    margin:0!important;transform:none!important;overflow-wrap:normal!important;
}
.topbar.pyrmont-team-topbar .pyrmont-account-nav > a:hover,
.topbar.pyrmont-team-topbar .pyrmont-account-nav > form:not(.language-form) > button:hover,
.topbar.pyrmont-team-topbar .pyrmont-account-nav > a[aria-current="page"] {background:rgba(255,255,255,.09)!important;border-color:#bd9760!important;}
.topbar.pyrmont-team-topbar .pyrmont-account-nav > form {margin:0!important;padding:0!important;}
.topbar.pyrmont-team-topbar .pyrmont-account-nav > .language-form {order:-1;height:auto!important;min-height:44px!important;}
.topbar.pyrmont-team-topbar .pyrmont-account-nav .language-select {
    width:auto!important;min-width:130px!important;max-width:180px!important;min-height:44px!important;height:44px!important;
    padding:0 30px 0 12px!important;border-radius:6px!important;border:1px solid rgba(255,255,255,.2)!important;
    background-color:transparent!important;color:#fff!important;font-size:.8rem!important;
}
.topbar.pyrmont-team-topbar a:focus-visible,
.topbar.pyrmont-team-topbar button:focus-visible,
.topbar.pyrmont-team-topbar select:focus-visible {outline:2px solid #e4c89e;outline-offset:3px;}
@media(max-width:900px) {
    .topbar.pyrmont-team-topbar {grid-template-columns:1fr!important;gap:8px!important;padding:12px max(12px,env(safe-area-inset-right)) 0 max(12px,env(safe-area-inset-left))!important;}
    .topbar.pyrmont-team-topbar > .brand {grid-column:1;grid-row:1;width:auto!important;}
    .topbar.pyrmont-team-topbar .pyrmont-account-nav {grid-column:1;grid-row:2;justify-content:flex-start;gap:8px;}
    .topbar.pyrmont-team-topbar .pyrmont-primary-nav {grid-column:1;grid-row:3;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 8px;}
    .topbar.pyrmont-team-topbar .pyrmont-primary-nav > a {min-height:48px;padding:10px 6px!important;font-size:.82rem!important;}
    .topbar.pyrmont-team-topbar .pyrmont-account-nav > a,
    .topbar.pyrmont-team-topbar .pyrmont-account-nav > form:not(.language-form) > button {padding:8px 10px!important;font-size:.76rem!important;}
    .topbar.pyrmont-team-topbar .pyrmont-account-nav .language-select {min-width:118px!important;max-width:150px!important;font-size:.76rem!important;}
}
@media print { .topbar.pyrmont-team-topbar {display:none!important;} }


/* Complete Pastry Team logo; original uploaded artwork, no colour filter. */
.topbar.pyrmont-pastry-topbar.pyrmont-team-topbar {padding-top:12px!important;}
.topbar.pyrmont-pastry-topbar .brand.pyrmont-brand--pastry {
    height:auto!important;min-height:0!important;flex:none!important;
    width:auto!important;padding:0!important;line-height:1!important;
}
.topbar.pyrmont-pastry-topbar .brand.pyrmont-brand--pastry img.pyrmont-pastry-logo {
    display:block!important;width:112px!important;height:84px!important;
    object-fit:contain!important;padding:6px!important;background:#fffdf9!important;
    border:1px solid rgba(189,151,96,.45)!important;border-radius:5px!important;
    filter:none!important;opacity:1!important;
}
.topbar.pyrmont-pastry-topbar:not(.pyrmont-team-topbar) {
    height:auto!important;min-height:108px!important;
}
@media(max-width:900px) {
    .topbar.pyrmont-pastry-topbar .brand.pyrmont-brand--pastry img.pyrmont-pastry-logo {
        width:96px!important;height:72px!important;
    }
    .topbar.pyrmont-pastry-topbar:not(.pyrmont-team-topbar) {min-height:0!important;}
}