/* ==========================================================================
   Forward Roots Catering — Shared Stylesheet
   Ported from old site.master inline CSS
   ========================================================================== */

/* --- Theme Variables --- */

:root {
    --bg-page: #ffffff;
    --bg-nav: #edece6;
    --bg-card: #ffffff;
    --bg-input: #fcfcfc;
    --bg-input-hover: #ffffff;
    --bg-footer: #dbd6c6;
    --bg-hover: rgba(0,0,0,.1);
    --bg-section-alt: #e9e8e5;
    --bg-popup: #edece6;
    --bg-popup-hdr: #c5c0af;
    --bg-ham-nav: #ffffff;
    --bg-ham-nav-hover: #c8cbc3;
    --bg-sub-header: #4d4b43;
    --bg-sub-header-hover: rgba(255,255,255,.3);
    --bg-btn: #dbd6c6;
    --bg-btn-hover: #ebeae0;
    --bg-btn-disabled: #efefef;
    --bg-attention: #e9d4d4;
    --bg-filter: #ddd;
    --bg-filter-hover: #f2f2f2;
    --bg-filter-active: #e7d5a6;
    --bg-review-section: #ede8df;
    --bg-review-input: #ffffff;
    --bg-review-card: #ffffff;
    --bg-success: #e8f5e3;
    --bg-error: #fce8e8;
    --bg-divlnk: #ddd;
    --bg-divlnk-overlay: rgba(0,0,0,.6);
    --bg-blkbtn: rgba(0,0,0,.67);
    --bg-blkbtn-hover: rgba(255,255,255,.2);
    --bg-selection: #3297FD;

    --text-primary: #555;
    --text-heading: #4b4741;
    --text-secondary: #777;
    --text-muted: #888;
    --text-disabled: #aaa;
    --text-dark: #333;
    --text-meta: #3b3c3d;
    --text-link: #449edb;
    --text-link-hover: #e29025;
    --text-link-create: #47738f;
    --text-link-create-hover: #b78628;
    --text-error: #a51414;
    --text-success: #5a751e;
    --text-footer: #312f2c;
    --text-footer-secondary: #717375;
    --text-filter-active: #3c4043;
    --text-btn-disabled: #959595;
    --text-review-label: #9a8e7a;
    --text-review-subtitle: #6e645a;
    --text-review-card-date: #aaa;
    --text-review-card-event: #9a8e7a;

    --border-input: none;
    --border-card: #e0ddd6;
    --border-piped: #acacac;
    --border-btn: #000;
    --border-btn-transparent: #000;
    --border-review-input: #ccc5b8;
    --border-review-focus: #9a8e7a;
    --border-sip-profile: #4b4741;

    --accent-gold: #c49a3c;
    --accent-orange: #e29025;
    --accent-green-submit: #6e8a47;
    --accent-green-submit-hover: #5e7a3a;
    --accent-star: #e2a913;
    --accent-star-default: #ccc5b8;
    --accent-active: #e29025;
    --accent-section-title: #706931;

    --shadow-default: rgba(0,0,0,.2);
    --shadow-card: rgba(0,0,0,.08);
    --shadow-popup: rgba(0,0,0,.4);
    --shadow-input: rgba(0,0,0,.4);

    --stroke-ham: #312f2c;
    --icon-profile: #4b4741;

    --color-success-badge: #3a7d34;
    --color-error-badge: #a51414;

    --bg-admin-panel: #f8f8f6;
    --bg-admin-row-hover: #f5f4f0;
    --bg-admin-row-border: #eee;
    --bg-admin-table-header: transparent;
    --bg-admin-edit-btn: #e8eef5;
    --bg-admin-edit-btn-hover: #d4dfed;
    --bg-admin-toggle-btn: #f0f0ec;
    --bg-admin-toggle-btn-hover: #e4e4df;
    --bg-admin-delete-btn: #fce8e8;
    --bg-admin-delete-btn-hover: #f0d0d0;
    --text-admin-edit-btn: #29658d;
    --text-admin-edit-btn-hover: #1a4a6e;
    --text-admin-delete-btn: #a51414;
    --bg-admin-tag-pill: #f0f4ec;
    --text-admin-tag-pill: #4a5e2f;
    --bg-admin-mfg-badge: #e8f0fa;
    --text-admin-mfg-badge: #2a5a8a;
    --bg-admin-status-active: #e8f5e3;
    --text-admin-status-active: #3a7d34;
    --bg-admin-status-inactive: #fce8e8;
    --text-admin-status-inactive: #a51414;
    --bg-admin-upload: #fafaf8;
    --bg-admin-upload-hover: #f0f4f8;
    --border-admin-upload: #bbb;
    --border-admin-upload-hover: #1a5289;
    --border-admin-input: rgba(31,31,31,.57);
    --border-admin-input-hover: rgba(31,31,31,.8);
    --border-admin-input-focus: #1a5289;
    --bg-admin-toast: #3a7d34;
    --bg-admin-toggle-on: #3a7d34;
    --bg-admin-tag-checked: #4a5e2f;
    --bg-admin-filter-btn: #f1f1ee;
    --bg-admin-filter-btn-hover: #e5e4df;
    --bg-admin-filter-btn-active: #4a5e2f;
    --bg-admin-manage-btn-text: #29658d;
    --bg-admin-manage-btn-text-hover: #1a4a6e;

    --bg-add-field: #f1f4f9;
    --bg-add-field-hover: #e2e8f5;
    --text-add-field: #29658d;
}

[data-theme="dark"] {
    --bg-page: #1e1e1e;
    --bg-nav: #282828;
    --bg-card: #242424;
    --bg-input: #2a2a2a;
    --bg-input-hover: #303030;
    --bg-footer: #282828;
    --bg-hover: rgba(255,255,255,.06);
    --bg-section-alt: #242424;
    --bg-popup: #2a2a2a;
    --bg-popup-hdr: #333;
    --bg-ham-nav: #282828;
    --bg-ham-nav-hover: #3a3a3a;
    --bg-sub-header: #333;
    --bg-sub-header-hover: rgba(255,255,255,.12);
    --bg-btn: #3a3a3a;
    --bg-btn-hover: #444;
    --bg-btn-disabled: #2a2a2a;
    --bg-attention: #3a2020;
    --bg-filter: #333;
    --bg-filter-hover: #3a3a3a;
    --bg-filter-active: #4a4230;
    --bg-review-section: #242424;
    --bg-review-input: #2a2a2a;
    --bg-review-card: #2a2a2a;
    --bg-success: #1e2e1a;
    --bg-error: #2e1a1a;
    --bg-divlnk: #333;
    --bg-divlnk-overlay: rgba(0,0,0,.5);
    --bg-blkbtn: rgba(255,255,255,.1);
    --bg-blkbtn-hover: rgba(255,255,255,.2);
    --bg-selection: #4a6a9a;

    --text-primary: #c8c0b0;
    --text-heading: #e0d5c4;
    --text-secondary: #8a8070;
    --text-muted: #6a6050;
    --text-disabled: #555;
    --text-dark: #d0c8b8;
    --text-meta: #9a9080;
    --text-link: #6aafdf;
    --text-link-hover: #e29025;
    --text-link-create: #6a9abf;
    --text-link-create-hover: #c8a858;
    --text-error: #e07070;
    --text-success: #8aaa6a;
    --text-footer: #9a9080;
    --text-footer-secondary: #6a6a6a;
    --text-filter-active: #e0d5c4;
    --text-btn-disabled: #555;
    --text-review-label: #8a8070;
    --text-review-subtitle: #9a9080;
    --text-review-card-date: #6a6050;
    --text-review-card-event: #6a6050;

    --border-input: 1px solid #3a3a3a;
    --border-card: #3a3a3a;
    --border-piped: #4a4a4a;
    --border-btn: #5a5448;
    --border-btn-transparent: #5a5448;
    --border-review-input: #3a3a3a;
    --border-review-focus: #5a5448;
    --border-sip-profile: #9a9080;

    --accent-gold: #c49a3c;
    --accent-orange: #e29025;
    --accent-green-submit: #6e8a47;
    --accent-green-submit-hover: #5e7a3a;
    --accent-star: #e2a913;
    --accent-star-default: #4a4438;
    --accent-active: #e29025;
    --accent-section-title: #c8b070;

    --shadow-default: rgba(0,0,0,.4);
    --shadow-card: rgba(0,0,0,.2);
    --shadow-popup: rgba(0,0,0,.6);
    --shadow-input: rgba(0,0,0,.3);

    --stroke-ham: #c8c0b0;
    --icon-profile: #9a9080;

    --color-success-badge: #6a9a5a;
    --color-error-badge: #e07070;

    --bg-admin-panel: #2a2a2a;
    --bg-admin-row-hover: #333;
    --bg-admin-row-border: #3a3a3a;
    --bg-admin-table-header: transparent;
    --bg-admin-edit-btn: #1e2e3e;
    --bg-admin-edit-btn-hover: #2a3e4e;
    --bg-admin-toggle-btn: #333;
    --bg-admin-toggle-btn-hover: #3a3a3a;
    --bg-admin-delete-btn: #3a2020;
    --bg-admin-delete-btn-hover: #4a2828;
    --text-admin-edit-btn: #6aafdf;
    --text-admin-edit-btn-hover: #8ac0ef;
    --text-admin-delete-btn: #e07070;
    --bg-admin-tag-pill: #333;
    --text-admin-tag-pill: #b0b0b0;
    --bg-admin-mfg-badge: #1e2a3a;
    --text-admin-mfg-badge: #6aafdf;
    --bg-admin-status-active: #1e2e1a;
    --text-admin-status-active: #6a9a5a;
    --bg-admin-status-inactive: #2e1a1a;
    --text-admin-status-inactive: #e07070;
    --bg-admin-upload: #2a2a2a;
    --bg-admin-upload-hover: #333;
    --border-admin-upload: #4a4a4a;
    --border-admin-upload-hover: #6a8aaf;
    --border-admin-input: rgba(200,200,200,.3);
    --border-admin-input-hover: rgba(200,200,200,.5);
    --border-admin-input-focus: #6a8aaf;
    --bg-admin-toast: #3a7d34;
    --bg-admin-toggle-on: #3a7d34;
    --bg-admin-tag-checked: #4a5e2f;
    --bg-admin-filter-btn: #333;
    --bg-admin-filter-btn-hover: #3a3a3a;
    --bg-admin-filter-btn-active: #4a5e2f;
    --bg-admin-manage-btn-text: #6aafdf;
    --bg-admin-manage-btn-text-hover: #8ac0ef;

    --bg-add-field: #1e2e3e;
    --bg-add-field-hover: #2a3a4a;
    --text-add-field: #6aafdf;
}

/* --- Theme transition --- */
body, header, footer, #HamNav, .divSipInner, .divSipHdr, .pnlSignInPw,
input[type="text"], input[type="password"], textarea, select,
.btn, .btnTrnsprntBrdr, .blkBtn, .fltrSpn, .statusLnkbtn,
.reviewInput, .reviewTextarea, .reviewCard, .reviewSectionBg, .reviewSubmitBtn,
.reviewMsg, .reviewFormMsg { transition: background-color .3s ease, color .3s ease, border-color .3s ease; }

/* --- Theme Toggle --- */
.theme-toggle { width: 48px; height: 26px; border-radius: 13px; position: relative; cursor: pointer; border: none; flex-shrink: 0; background: #d5d0c4; transition: background .3s ease; }
#DivHeaderContentWrap > .theme-toggle { float: right; margin: 32px 10px 0; display: none; }
.ham-theme-toggle { float: none; margin: 0; }
#DivHamNavThemeToggle { padding: 10px 20px; }
[data-theme="dark"] .theme-toggle { background: #4a7a3a; }

.theme-toggle::after { content: ''; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; transition: left .3s ease; }
[data-theme="dark"] .theme-toggle::after { left: 25px; }

.theme-toggle-icon { position: absolute; top: 4px; font-size: 13px; line-height: 18px; pointer-events: none; }
.theme-toggle-icon.sun { left: 6px; opacity: 0; color: #1e1e1e; transition: opacity .2s; }
.theme-toggle-icon.moon { right: 6px; opacity: 1; color: #8a8070; transition: opacity .2s; }
[data-theme="dark"] .theme-toggle-icon.sun { opacity: 1; }
[data-theme="dark"] .theme-toggle-icon.moon { opacity: 0; }

/* --- CSS Reset (Elad Shechter v1.7.3) --- */

*:where(:not(html, iframe, canvas, img, svg, video, audio, input[type="radio"], input[type="checkbox"]):not(svg *, symbol *)) { all: unset; display: revert; }
*, *::before, *::after { box-sizing: border-box; }
a, button { cursor: revert; }
ol, ul, menu { list-style: none; }
img { max-width: 100%; }
table { border-collapse: collapse; }
input, textarea { -webkit-user-select: auto; }
textarea { white-space: revert; }
meter { -webkit-appearance: revert; appearance: revert; }
::placeholder { color: unset; }
:where([hidden]) { display: none; }
:where([contenteditable]:not([contenteditable="false"])) { -moz-user-modify: read-write; -webkit-user-modify: read-write; overflow-wrap: break-word; -webkit-line-break: after-white-space; -webkit-user-select: auto; }
:where([draggable="true"]) { -webkit-user-drag: element; }
span, a { display: inline-block; }

/* --- Base --- */

html, body { height: 100%; }

body {
    font-size: 18px;
    color: var(--text-primary);
    background-color: var(--bg-page);
    overflow-y: scroll;
    min-width: 300px;
    display: flex;
    flex-direction: column;
    font-family: 'Google Sans', Roboto, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

a:not(#SpnHdrNav a, .btn, .btnTrnsprntBrdr, .blkBtn, .fltrSpn, #HamNavItemsWrap a, a.lnkbtnSignInProfile, #SpnSubHdrPrmryLnks a, #DivSipSignedInLnkbtns a, .addFieldBtn, .backArrow, .dltUdGroupLnkbtn, .rowWrap, .miLnk, a.active, .addBtn) { color: var(--text-link); transition: all .16s ease-in-out; }

a:not(#SpnHdrNav a, .btn, .btnTrnsprnt, .btnTrnsprntBrdr, .blkBtn, .fltrSpn, #HamNavItemsWrap a, a.lnkbtnSignInProfile, #SpnSubHdrPrmryLnks a, #DivSipSignedInLnkbtns a, .addFieldBtn, .backArrow, .dltUdGroupLnkbtn, .rowWrap, .miLnk, a.active, .addBtn):hover,
a:not(#SpnHdrNav a, .btn, .btnTrnsprnt, .btnTrnsprntBrdr, .blkBtn, .fltrSpn, #HamNavItemsWrap a, a.lnkbtnSignInProfile, #SpnSubHdrPrmryLnks a, #DivSipSignedInLnkbtns a, .addFieldBtn, .backArrow, .dltUdGroupLnkbtn, .rowWrap, .miLnk, a.active, .addBtn):focus { color: var(--text-link-hover); }

::selection { background-color: var(--bg-selection); color: #fff; }

/* --- Layout --- */

.mainContent { flex: 1 0 auto; position: relative; }

/* --- Header --- */

header { position: relative; background-color: var(--bg-nav); box-shadow: 0 3px 3px var(--shadow-default); }

header, #DivHeaderContentWrap, #HamNavTop, #SpnHdrNav a { height: 90px; }

#DivHeaderContentWrap, #DivPageTitle, .row { max-width: 1600px; }

.mw1000 { max-width: 1000px; }
.mw1200 { max-width: 1200px; }

.m0auto { margin: 0 auto; }
.mt10auto { margin: 10px auto 0; }
.mt20auto { margin: 20px auto 0; }
.mt30auto { margin: 30px auto 0; }

#DivHeaderContentWrap, #DivPageTitle { position: relative; margin: 0 auto; }

.sctnCntnr1560 { max-width: 1560px; margin: 0 auto; }

#DivPageTitle { padding: 0 6%; margin-top: 20px; }

#DivHeaderContentWrap, #DivPageTitle, section, .sctnCntnr1560, .row, .col { position: relative; }

#ImgHdrLogo, #SpnHdrTitle, #ImgHamNavHdrLogo, #spnHamNavHdrTitle, #ImgHdrLogoBrlp, #ImgHamNavHdrLogoBrlp { float: left; }

/* --- Titles --- */

.pageTitle, .pageTitleNrml, .sctnTitle, .sctnTitleNrml { color: var(--text-heading); }

.pageTitle, .sctnTitle { font-family: 'Qwitcher Grypen', cursive; font-size: 56px; font-weight: bold; }

p, .pageTitleNrml, .sctnTitleNrml, ul.bullets { line-height: 1.5; }

.pageTitleNrml { font-family: 'Google Sans', Roboto, Arial, sans-serif; font-size: 29px; }

.sctnTitle { margin: 0 auto 20px; max-width: 1560px; }

.sctnTitleNrml { font-family: 'Google Sans', Roboto, Arial, sans-serif; font-size: 29px; }

section, .sctnCntnr1560, .row, .col { background-size: cover; background-repeat: no-repeat; background-position: 50%; }

section { padding: 50px 6%; }

/* --- Hamburger Nav --- */

#HamNav { background-color: var(--bg-ham-nav); box-shadow: none; text-align: left; display: flex; flex-direction: column; height: 100vh; padding: 0 0 15px; position: fixed; right: 0; top: 0; transform: translateX(105%); transition: transform .4s ease-in-out, box-shadow .4s ease-in-out, visibility 0s .4s; visibility: hidden; width: 88%; z-index: 990; }

#DivHeaderContentWrap.active #HamNav { box-shadow: -4px 0 10px 0 rgb(0 0 0 / 60%); transform: translateX(0); transition: transform .4s ease-in-out, box-shadow .4s ease-in-out; visibility: visible; }

#HamNavTop { background-color: var(--bg-nav); padding: 24px 0 20px 20px; }

#HamNavItemsWrap { flex: 1 0 auto; margin: 10px 0; max-height: 100%; overflow-y: auto; }

#HamNavItemsWrap a, #DivSipSignedInLnkbtns a { display: block; color: var(--text-heading); padding: 10px 20px; transition: all ease-in-out .25s; }

#HamNavItemsWrap a:hover, #DivSipSignedInLnkbtns a:hover { background-color: var(--bg-ham-nav-hover); transition: all ease-in-out .25s; }

#HamNavItemsWrap a.hamNavSub1 { padding-left: 50px; }

#DivLnkbtnForgotPw { margin-top: 20px; }

#DivLblMsgSip { padding: 20px; line-height: 1.5; }

/* --- Greyout overlay --- */

#Greyout { background-color: #000; position: fixed; top: 0; left: 0; bottom: 0; right: 0; z-index: 980; opacity: 0; visibility: hidden; transition: visibility .4s ease-in-out, opacity .4s ease-in-out; }

#DivHeaderContentWrap.active #Greyout { opacity: .3; visibility: visible; transition: visibility .4s ease-in-out, opacity .4s ease-in-out; }

#DivHeaderContentWrap.divSipActive #Greyout { opacity: .6; visibility: visible; transition: visibility .2s ease-in-out, opacity .2s ease-in-out; z-index: 1600; }

/* --- Header logo & nav links --- */

#LnkHdrLogoAndTitle { padding: 24px 12px 26px 20px; }

#SpnHdrNav { float: right; color: var(--text-heading); font-size: 18px; display: none; }

#SpnHdrNav a { float: left; padding: 0 16px; line-height: 90px; }

#LnkHdrLogoAndTitle, #SpnHdrNav a, a.lnkbtnSignInProfile, #DivSip, .fltrSpn { transition: all .2s ease-in-out; }

header #LnkHdrLogoAndTitle { transition-property: background-color; transition-duration: .2s; transition-timing-function: ease-in-out; }

header #LnkHdrLogoAndTitle:hover, #SpnHdrNav a:hover, a.lnkbtnSignInProfile:hover, a.lnkbtnSignInProfile:focus:not(a.lnkbtnSignInProfile) { background-color: var(--bg-hover); }

/* --- Hamburger SVG icon --- */

.ham { cursor: pointer; -webkit-tap-highlight-color: transparent; transition: transform 400ms; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; position: absolute; right: 20px; top: 20px; width: 50px; z-index: 1000; }

.ham.active { position: fixed; }

.hamRotate.active { transform: rotate(45deg); }

.hamRotate180.active { transform: rotate(180deg); }

.line { fill: none; transition: stroke-dasharray 400ms, stroke-dashoffset 400ms; stroke: var(--stroke-ham); stroke-width: 5.5; stroke-linecap: round; }

.ham4 .top { stroke-dasharray: 40 121; }
.ham4 .bottom { stroke-dasharray: 40 121; }

.ham4.active .top { stroke-dashoffset: -68px; }
.ham4.active .bottom { stroke-dashoffset: -68px; }

/* --- Sub-header primary links --- */

#DivSubHdrPrmryLnks { width: 100%; line-height: 50px; padding: 0 6%; background-color: var(--bg-sub-header); display: none; }

#SpnSubHdrPrmryLnks { display: flex; align-items: center; min-width: 0; justify-content: center; }

#SpnSubHdrPrmryLnks a { text-transform: uppercase; font-size: 14px; font-weight: 600; color: #fff; padding: 0 10px; }

#SpnSubHdrPrmryLnks a:hover { background-color: var(--bg-sub-header-hover); }

/* --- Sign-in / Profile popup & bar --- */

.lnkbtnSignInProfile { line-height: 90px; height: 90px; float: right; letter-spacing: 1px; padding: 0 16px; }

#LnkbtnSignInProfile.lnkbtnSignInProfile { display: none; }

.spnSignInProfileOuter, .spnSignInProfileInfoAndStatus { float: left; }

.spnSignInProfileInfoAndStatus { text-transform: capitalize; font-size: 14px; line-height: 18px; margin-left: 10px; }

#LnkbtnSignInProfile .spnSignInProfileInfoAndStatus { margin-top: 26px; }

.spnSignInProfileOuter, .spnSignInProfileInner { width: 46px; height: 46px; }

.spnSignInProfileOuter { position: relative; margin-top: 22px; }

.spnSignInProfileInner { border-radius: 50%; position: absolute; top: 0; left: 0; overflow: hidden; }

#LnkbtnSignInProfile .spnSignInProfileInner { border: 2px solid var(--border-sip-profile); }

.spnSignInProfileInner::before { content: ''; width: 16px; height: 16px; border-radius: 50%; position: absolute; left: calc(50% - 8px); top: 10px; }

.spnSignInProfileInner::after { content: ''; width: 30px; height: 30px; border-radius: 50%; position: absolute; left: calc(50% - 15px); top: 30px; }

#LnkbtnSignInProfile .spnSignInProfileInner::before, #LnkbtnSignInProfile .spnSignInProfileInner::after { background-color: var(--icon-profile); }

/* --- Sign-in popup panel --- */

#DivSip a#LnkCreateAcct { color: var(--text-link-create); transition: all .16s ease-in-out; }
#DivSip a#LnkCreateAcct:hover { color: var(--text-link-create-hover); }

#DivSip { position: absolute; top: 100px; z-index: 2000; font-size: 16px; opacity: 0; visibility: hidden; width: 100%; height: 1px; padding: 0 6%; }

.divSipActive #DivSip { opacity: 1; visibility: visible; }

.divSipInner { border-radius: 5px; box-shadow: 5px 5px 9px var(--shadow-popup); margin: 0 auto; max-width: 271px; overflow: hidden; }

#DivSipSignedOut.divSipInner { background-color: var(--bg-popup); }
#DivSipSignedIn.divSipInner { background-color: var(--bg-popup); }

#DivSip .btn, #DivSip .btnTrnsprnt { text-transform: capitalize; letter-spacing: 0; }

#DivSip input[type="text"], #DivSip input[type="password"] { color: var(--text-meta); }

.divSipHdr { position: relative; padding: 20px; border-radius: 5px 5px 0 0; }

#DivSipSignedOut .divSipHdr { background-color: var(--bg-popup-hdr); }
#DivSipSignedIn .divSipHdr { background-color: var(--bg-popup-hdr); }

.pnlSignInPw { padding: 20px; border-radius: 0 0 5px 5px; }

#LnkCreateAcct { position: absolute; top: 20px; right: 20px; }

.pnlSignInPw .lblAndTbox { margin-top: 40px; }

.lbl1 { font-weight: 500; margin-right: .4em; }

#DivLnkbtnSignInCellOrEmail, #DivLnkbtnSignInPw { position: relative; margin-top: 20px; }

#LblUserFullName { font-weight: bold; }

.fa-eye { position: absolute; top: 12px; right: 13px; cursor: pointer; }

/* --- Forms --- */

input[type="text"], input[type="password"], textarea, select { width: 100%; background-color: var(--bg-input); box-shadow: 0 0 4px var(--shadow-input); border: var(--border-input); color: var(--text-primary); }

input[type="text"]:hover, input[type="text"]:focus, input[type="password"]:hover, input[type="password"]:focus, textarea:hover, textarea:focus, select:hover, select:focus { background-color: var(--bg-input-hover); }

input[type="text"], input[type="password"], select { height: 40px; line-height: 40px; padding: 0 12px; }

select { min-width: 80px; }

textarea { line-height: 1.4; padding: 12px; height: 300px; }

input[type="text"].attention, textarea.attention { background-color: var(--bg-attention); }
select.attention { background-color: var(--bg-attention); }

.attention:not(select) { color: var(--text-error); }
.success:not(select) { color: var(--text-success); }

.lblAndTboxDivs .lblAndTbox:first-child { margin-top: 30px; }
.lblAndTbox { position: relative; margin-top: 40px; }
.topLbl { position: absolute; top: -24px; left: 2px; font-size: 15px; }

/* --- Typography --- */

p { margin: 1em 0; }
p.mb0 { margin-bottom: 0; }

h1, .subTitle { font-size: 60px; margin-bottom: 20px; font-family: 'Qwitcher Grypen', cursive; }

.subTitleDiv { margin: 20px 0; }
.subTitleDivNormal { font-size: 22px; margin-left: .8em; color: #fff; }

/* --- Utilities --- */

.cfx:after, ul.hbullets:after, #DivHeaderContentWrap:after, #SpnHdrNav:after, #LnkHdrLogoAndTitle:after, #LnkHamNavHdrLogoAndTitle:after, .row:after, .sctnCntnr1560:after, .chkbx:after, .lnkbtnSignInProfile:after { content: ""; display: table; clear: both; }

.left { float: left; }
.right { float: right; }

.rel { position: relative; }
.abs { position: absolute; }

.tl { text-align: left; }
.tc { text-align: center; }
.tr { text-align: right; }

.tcMt30 { text-align: center; margin-top: 30px; }

.quitcher { font-family: 'Qwitcher Grypen', cursive; }

.bold { font-weight: bold; }
.fff { color: #fff; }

.boxShad224_50 { box-shadow: 2px 2px 4px rgb(0 0 0 / 50%); }

.pTitle { max-width: 840px; margin: 0 auto; margin-bottom: 20px; }

.iblock { display: inline-block; }

.pt0 { padding-top: 0; }
.pt10 { padding-top: 10px; }
.pt20 { padding-top: 20px; }
.pt30 { padding-top: 30px; }
.pt40 { padding-top: 40px; }

.ptb10 { padding-top: 10px; padding-bottom: 10px; }
.ptb20 { padding-top: 20px; padding-bottom: 20px; }
.ptb30 { padding-top: 30px; padding-bottom: 30px; }
.ptb40 { padding-top: 40px; padding-bottom: 40px; }

.offWhtYllwBg { background-color: var(--bg-section-alt); }

/* --- Buttons --- */

.btn, .btnTrnsprnt, .btnTrnsprntBrdr, .blkBtn { display: inline-block; text-align: center; text-transform: uppercase; letter-spacing: 2px; transition: all .2s ease-in-out; }

.btn, .btnTrnsprnt, .btnAttn { height: 40px; line-height: 40px; border-radius: 4px; }

.btn { padding: 0 20px; background-color: var(--bg-btn); box-shadow: 2px 2px 3px var(--shadow-default); }
.btn:hover { background-color: var(--bg-btn-hover); cursor: pointer; }
.btn.aspNetDisabled, .btn.aspNetDisabled:hover { background-color: var(--bg-btn-disabled); color: var(--text-btn-disabled); cursor: default; }

.btnTrnsprnt { padding: 0 10px; background-color: transparent; text-transform: capitalize; }
.btnTrnsprnt:hover { background-color: var(--bg-hover); }

.btnTrnsprntBrdr { padding: 0 20px; line-height: 40px; background-color: transparent; color: var(--text-dark); border: 1px solid var(--border-btn-transparent); }
.btnTrnsprntBrdr:hover { background-color: rgba(0,0,0,.05); border: 1px solid transparent; }

.blkBtn { padding: 16px 24px; background-color: var(--bg-blkbtn); color: #fff; border: 1px solid #fff; }
.blkBtn:hover { background-color: var(--bg-blkbtn-hover); border: 1px solid transparent; }

/* --- Lists --- */

ul.bullets { list-style: disc; padding-inline-start: 40px; }

ul.piped li { border-left: 1px solid var(--border-piped); display: inline; padding-left: .75em; margin-left: .55em; }
ul.piped li:first-child { border-left: 0 none !important; margin-left: 0 !important; padding-left: 0 !important; }

ul.hbullets li { float: left; white-space: nowrap; }
ul.hbullets li:before { content: "\2022"; margin: 0 .4em; color: var(--text-secondary); }
ul.hbullets li:first-child:before { content: none; }

ul.hbullets li a.active { cursor: default; color: var(--accent-active) !important; pointer-events: none; }

/* --- Filter spans --- */

.fltrSpn, .statusLnkbtn { display: inline-block; padding: 10px 20px; background-color: var(--bg-filter); color: #0072bc; border-radius: 6px; cursor: pointer; }
.fltrSpn:hover, .statusLnkbtn:hover { background-color: var(--bg-filter-hover); }
.fltrSpn.active, .statusLnkbtn.active { background-color: var(--bg-filter-active); color: var(--text-filter-active); cursor: default; }
.fltrSpnPrntFlx { display: flex; justify-content: center; flex-flow: row wrap; gap: 10px 10px; text-align: center; margin-bottom: 16px; }

/* --- Grid / Columns --- */

.row { margin: auto; }

.col { min-height: 1px; float: left; width: 100%; }

.row_2col .col:last-child, .row_4col .col { margin-top: 30px; }

.tcFs30Upper { text-align: center; color: var(--accent-section-title); font-size: 30px; text-transform: uppercase; }

.divLnk { display: block; background-color: var(--bg-divlnk); box-shadow: 3px 3px 10px rgba(0,0,0,.6); padding-bottom: 18px; }

.divLnkTitle { font-family: 'Qwitcher Grypen', cursive; font-size: 48px; font-weight: bold; background-color: var(--bg-divlnk-overlay); color: #fff; padding: 10px 12px; }

.divLnkDesc { padding: 10px 15px; margin: 14px 14px 0; background-color: var(--bg-divlnk-overlay); color: #fff; line-height: 24px; }

/* --- Logo sizing --- */

#ImgHdrLogo, #ImgHamNavHdrLogo, #ImgHdrLogoBrlp, #ImgHamNavHdrLogoBrlp { height: 40px; }

#ImgHdrLogo, #ImgHamNavHdrLogo { display: none; }

#SpnHdrTitle, #spnHamNavHdrTitle { font-weight: 700; font-family: 'Qwitcher Grypen', cursive; font-size: 36px; line-height: 1; }

#SpnHdrTitle { color: var(--text-heading); font-size: 36px; margin-top: 1px; margin-left: 10px; }

#spnHamNavHdrTitle { color: var(--text-heading); font-size: 30px; margin-top: 5px; margin-left: 10px; }

#SpnHdrTitleCatering, #spnHamNavHdrTitleCatering { display: none; }

/* --- Footer --- */

footer { flex-shrink: 0; padding: 20px; background-color: var(--bg-footer); color: var(--text-footer); text-align: center; }

#FooterBottom { font-size: 15px; line-height: 1.4; max-width: 1600px; margin: 0 auto; color: var(--text-footer-secondary); }

.copyrightSymbl { font-family: Roboto, Arial, sans-serif; }

#Copyright.hbullets li { float: none; display: block; margin: 0 !important; }
#Copyright.hbullets li a, #LnkEsd { padding: .3em .86em 0; }
#Copyright.hbullets li:before { content: none; margin: 0; }

#DivLnkEsd { margin-top: 6px; }

#SpnPwrdBy, #SpnLnkEsd { display: block; }

/* ==========================================================================
   Responsive
   ========================================================================== */

@media (min-width: 340px) {
    #SpnHdrTitle { font-size: 46px; line-height: .8; }
}

@media (min-width: 400px) {
    #LnkHdrLogoAndTitle { padding: 17px 15px 17px 20px; }
    #HamNavTop { padding: 17px 15px 17px 20px; }
    #ImgHdrLogo, #ImgHamNavHdrLogo, #ImgHdrLogoBrlp, #ImgHamNavHdrLogoBrlp { height: 56px; }
    #SpnHdrTitle { font-size: 55px; line-height: .9; }
    #spnHamNavHdrTitle { font-size: 45px; margin-top: 3px; }
}

@media (min-width: 450px) {
    #Copyright { display: inline-block; }
    #Copyright.hbullets li { float: left; }
    #Copyright.hbullets li a { padding: 0; }
    #Copyright.hbullets li:before { content: "\2022"; margin: 0 .4em; }
    #Copyright.hbullets li:first-child:before { content: none; }
    #DivLnkEsd { margin-top: 0; }
    #SpnPwrdBy, #SpnLnkEsd { display: inline; }
    #LnkEsd { padding: 0 .3em; }
}

@media (min-width: 540px) {
    #LnkHdrLogoAndTitle { padding: 17px 18px 17px 20px; }
    #SpnHdrTitleCatering, #spnHamNavHdrTitleCatering { display: inline-block; }
    #spnHamNavHdrTitle { font-size: 48px; margin-top: 1px; }
}

@media (min-width: 600px) {
    #spnHamNavHdrTitle { font-size: 56px; line-height: .9; }
    .divSipInner { position: absolute; top: 0; right: 82px; }
    #DivSipSignedIn.divSipInner { min-width: 271px; }
}

@media (min-width: 610px) {
    #SpnHdrTitle { font-size: 56px; }
    #DivSubHdrPrmryLnks { display: block; }
}

@media (min-width: 620px) {
    #DivHeaderContentWrap > .theme-toggle { display: block; margin: 32px 84px 0 10px; }
}

@media (min-width: 630px) {
    .row_4col .col { width: 47.5%; }
    .row_4col .col:nth-child(even) { margin-left: 5%; }
}

@media (min-width: 800px) {
    #HamSvg { display: none; }
    #LnkbtnSignInProfile.lnkbtnSignInProfile { display: inline-block; }
    #DivSubHdrPrmryLnks { background-color: #696553; }
    #DivHeaderContentWrap > .theme-toggle { margin: 32px 10px 0; }
    #Copyright { float: left; }
    #DivLnkEsd { float: right; }
    .row_2col .col { width: 47.5%; }
    .row_2col .col:last-child { margin-left: 5%; margin-top: 0; }
}

@media (min-width: 1024px) {
    .row_4col .col { width: 21.25%; margin-left: 5%; }
    .row_4col .col:first-child { margin-left: 0; }
}

@media (min-width: 1350px) {
    #LnkHeaderMenu, #DivSubHdrPrmryLnks { display: none; }
    #SpnHdrNav { display: inline-block; }
}

@media (min-width: 1600px) {
    #DivPageTitle { padding: 0 96px; }
}

/* ==========================================================================
   Review Form
   ========================================================================== */

.reviewSectionBg { background-color: var(--bg-review-section); }

.reviewFormWrap { max-width: 640px; margin: 0 auto; }

.reviewFormLabel { font-size: 12px; text-transform: uppercase; letter-spacing: 3px; color: var(--text-review-label); font-weight: 600; }

.reviewFormTitle { font-family: 'Qwitcher Grypen', cursive; font-size: 48px; font-weight: bold; color: var(--text-heading); margin-top: 6px; }

.reviewFormSubtitle { font-size: 16px; color: var(--text-review-subtitle); margin-top: 6px; line-height: 1.5; }

.reviewForm { margin-top: 24px; }

.reviewFieldGroup { margin-top: 20px; }
.reviewFieldGroup:first-child { margin-top: 0; }

.reviewFieldLabel { font-weight: 600; font-size: 14px; color: var(--text-heading); margin-bottom: 8px; }

.reviewInput { width: 100%; height: 44px; padding: 0 14px; border: 1px solid var(--border-review-input); border-radius: 6px; font-size: 15px; background: var(--bg-review-input); color: var(--text-primary); transition: border-color .15s; }
.reviewInput:focus { border-color: var(--border-review-focus); outline: none; }

.reviewTextarea { width: 100%; height: 140px; padding: 12px 14px; border: 1px solid var(--border-review-input); border-radius: 6px; font-size: 15px; line-height: 1.5; background: var(--bg-review-input); color: var(--text-primary); resize: vertical; transition: border-color .15s; }
.reviewTextarea:focus { border-color: var(--border-review-focus); outline: none; }

/* Star rating */
.starRating { display: flex; gap: 0; }
.starRating .star { font-size: 28px; color: var(--accent-star-default); cursor: pointer; transition: color .1s; user-select: none; line-height: 1; padding: 4px 3px; }
.starRating .star.hovered { color: var(--accent-star); }
.starRating .star.selected { color: var(--accent-star); }

/* Submit button */
.reviewSubmitBtn { display: block; width: 100%; margin-top: 24px; padding: 14px 20px; background-color: var(--accent-green-submit); color: #fff; font-size: 16px; font-weight: 600; border: none; border-radius: 8px; cursor: pointer; transition: background-color .15s; text-align: center; letter-spacing: 1px; }
.reviewSubmitBtn:hover { background-color: var(--accent-green-submit-hover); }

/* Success/error messages */
.reviewMsg { margin-top: 16px; padding: 12px 16px; border-radius: 6px; line-height: 1.5; text-align: center; }
.reviewMsg.success { background: var(--bg-success); color: var(--color-success-badge); }
.reviewMsg.error { background: var(--bg-error); color: var(--color-error-badge); }

.reviewFormMsg { margin-top: 14px; padding: 10px 16px; border-radius: 6px; text-align: center; line-height: 1.5; font-size: 15px; }
.reviewFormMsg.error { background: var(--bg-error); color: var(--color-error-badge); }
.reviewFormMsg.success { background: var(--bg-success); color: var(--color-success-badge); }

/* Existing reviews display */
.reviewCard { background: var(--bg-review-card); border-radius: 8px; padding: 20px; margin-top: 16px; box-shadow: 0 1px 4px var(--shadow-card); }
.reviewCard:first-child { margin-top: 0; }
.reviewCardHeader { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.reviewCardName { font-weight: 600; color: var(--text-heading); font-size: 16px; }
.reviewCardDate { font-size: 13px; color: var(--text-review-card-date); }
.reviewCardStars { color: var(--accent-star); font-size: 18px; letter-spacing: 2px; margin-top: 4px; }
.reviewCardText { margin-top: 10px; line-height: 1.6; color: var(--text-primary); font-size: 15px; }
.reviewCardEvent { margin-top: 8px; font-size: 13px; color: var(--text-review-card-event); font-style: italic; }