.tap-cell.lapsed{color:#83918d;background:#f1f4f3;border-color:#d5dcda}.checkout-methods{margin:16px 0}.checkout-methods .title{margin-bottom:10px}.payment-choice-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.payment-choice-grid button{text-align:left;background:#fff;border:1px solid #d5e0dc;border-radius:10px;flex-direction:column;gap:4px;padding:11px;display:flex;position:relative}.payment-choice-grid button.active{background:#effcf3;border-color:#00c853}.payment-choice-grid button:disabled{opacity:.48}.payment-choice-grid small{color:#688078;font-size:8px}.payment-choice-grid i{color:#00a848;position:absolute;top:9px;right:9px}.manual-payment-proof{background:#f3fcf6;border:1px solid #b7dfc5;border-radius:12px;grid-template-columns:76px 1fr;gap:12px;margin-top:10px;padding:12px;display:grid}.manual-payment-proof>img{object-fit:contain;background:#fff;border:1px solid #cde3d5;border-radius:8px;width:76px;height:76px}.manual-payment-proof>div{gap:6px;display:grid}.manual-payment-proof label{font-size:8px}.manual-payment-proof input{width:100%;margin-top:4px}.manual-payment-proof>p{color:#9b6600;grid-column:1/-1;margin:0;font-size:8px}.gateway-note{color:#53716a;background:#f1f6f4;border-radius:8px;padding:9px;font-size:8px}.booking-calendar-layout{grid-template-columns:minmax(0,1.7fr) minmax(300px,.7fr);gap:18px;display:grid}.calendar-head{justify-content:space-between;align-items:center;margin-bottom:14px;display:flex}.calendar-head button{background:#fff;border:1px solid #d6e1dd;border-radius:9px;width:38px;height:38px;font-size:24px}.calendar-weekdays,.calendar-grid{grid-template-columns:repeat(7,1fr);display:grid}.calendar-weekdays b{text-align:center;padding:9px;font-size:8px}.calendar-grid button{text-align:left;background:#fff;border:0;border-top:1px solid #e0e8e5;border-left:1px solid #e0e8e5;flex-direction:column;gap:12px;min-height:92px;padding:9px;display:flex}.calendar-grid button:nth-child(7n){border-right:1px solid #e0e8e5}.calendar-grid button:nth-last-child(-n+7){border-bottom:1px solid #e0e8e5}.calendar-grid button.outside{color:#a4afab;background:#f8faf9}.calendar-grid button.selected{outline-offset:-2px;background:#f0fcf4;outline:2px solid #00b94f}.calendar-grid em{color:#087e3c;background:#e6f8ec;border-radius:7px;padding:5px;font-size:8px;font-style:normal}.calendar-grid em.pending{color:#9b6300;background:#fff0d5}.calendar-day-panel .day-total{color:#078d43;margin:8px 0 14px;display:block}.calendar-day-list article{border-bottom:1px solid #e0e8e5;grid-template-columns:115px 1fr;gap:12px;padding:13px 0;display:grid}.calendar-day-list article>div,.calendar-day-list article>span{flex-direction:column;gap:4px;display:flex}.calendar-day-list small{color:#789089}.calendar-day-list em{color:#078d43;background:#e4f8eb;border-radius:7px;align-self:flex-start;padding:4px 7px;font-size:8px;font-style:normal}.calendar-day-list em.pending{color:#9b6300;background:#fff0d5}.payment-settings-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}.payment-setting-card{flex-direction:column;gap:11px;display:flex}.payment-setting-card label{font-size:8px;font-weight:800}.payment-setting-card input{width:100%;margin-top:5px}.setting-toggle{justify-content:space-between;align-items:center;display:flex}.setting-toggle>b{font-size:16px}.setting-toggle button{background:#ccd8d4;border:0;border-radius:20px;width:45px;height:25px;padding:3px}.setting-toggle button i{background:#fff;border-radius:50%;width:19px;height:19px;transition:all .2s;display:block}.setting-toggle button.on{background:#00bd50}.setting-toggle button.on i{transform:translate(20px)}.qr-upload img{object-fit:contain;border:1px solid #cfe0d8;border-radius:8px;width:90px;height:90px;margin-top:8px;display:block}.gateway-card{justify-content:flex-start}.save-payment-methods{max-width:480px;margin:0 auto}.owner-success{color:#087f40;background:#e8f9ee;border-radius:8px;padding:10px}@media (width<=950px){.booking-calendar-layout,.payment-settings-grid{grid-template-columns:1fr}}@media (width<=650px){.calendar-grid button{min-height:64px;padding:5px}.calendar-grid em{padding:3px;font-size:6px}.calendar-weekdays b{font-size:6px}.payment-choice-grid,.manual-payment-proof{grid-template-columns:1fr}.calendar-day-list article{grid-template-columns:95px 1fr}}.payment-receipt-thumb{object-fit:cover;border:1px solid #cfe0d8;border-radius:8px;width:78px;height:78px;margin-top:7px}.owner-settings>.panel:nth-child(2){grid-column:1/-1}.manual-date-strip{grid-template-columns:repeat(7,minmax(92px,1fr));gap:9px;margin:18px 0;display:grid}.manual-date-strip button{border:1px solid var(--line);min-height:108px;color:var(--ink);cursor:pointer;background:#fff;border-radius:13px;flex-direction:column;justify-content:center;align-items:center;gap:2px;display:flex}.manual-date-strip small{color:#108a45;letter-spacing:.5px;font-size:8px;font-weight:900}.manual-date-strip b{font-size:25px;line-height:1}.manual-date-strip span{font-size:9px;font-weight:800}.manual-date-strip em{color:var(--muted);margin-top:6px;font-size:7px;font-style:normal}.manual-date-strip button.active{color:#fff;background:linear-gradient(145deg,#03a943,#02cc59);border-color:#03a943;box-shadow:0 8px 20px #01a9432e}.manual-date-strip button.active small,.manual-date-strip button.active em{color:#fff}.manual-grid-scroll{border:1px solid var(--line);background:#fff;border-radius:13px;overflow:auto}.manual-slot-grid{min-width:max-content;display:grid}.manual-grid-head{z-index:2;border-bottom:1px solid var(--line);text-align:center;background:#f6f9f7;padding:13px 8px;font-size:8px;font-weight:900;position:sticky;top:0}.manual-grid-head.time{text-align:left;padding-left:18px}.manual-time{border-bottom:1px solid var(--line);white-space:nowrap;background:#fbfdfc;align-items:center;gap:7px;padding:12px 13px;font-size:9px;display:flex}.manual-cell{color:#173329;cursor:pointer;background:#eff9f1;border:1px solid #cfe7d5;border-radius:9px;flex-direction:column;justify-content:center;align-items:center;gap:4px;min-height:62px;margin:5px;padding:7px;display:flex}.manual-cell strong{font-size:8px}.manual-cell small{color:#608174;font-size:6px}.manual-cell.picked{color:#fff;background:linear-gradient(145deg,#03a943,#08c954);border-color:#02963c}.manual-cell.picked small{color:#eafff1}.manual-cell.booking{color:#b9422c;background:#fff0ec;border-color:#ffb5a4}.manual-cell.openplay{color:#5d47a8;background:#f1edff;border-color:#cdc3ff}.manual-cell.blocked{color:#69736f;background:#eef0ef;border-color:#d5dbd8}.manual-cell.lapsed{color:#a0a7a4;background:#f5f6f5;border-color:#e3e6e4}.manual-cell:disabled{opacity:1;cursor:not-allowed}.manual-block-footer{grid-template-columns:1.05fr 1.25fr .8fr;gap:12px;margin-top:14px;display:grid}.manual-selection-summary,.manual-block-details,.manual-block-action{border:1px solid var(--line);background:#fff;border-radius:12px;padding:14px}.manual-selection-summary{align-items:flex-start;gap:13px;display:flex}.manual-selection-summary>span{color:#fff;background:#079d42;border-radius:50%;flex:none;place-items:center;width:42px;height:42px;font-size:20px;font-weight:900;display:grid}.manual-selection-summary>div,.manual-block-details{flex-direction:column;gap:5px;display:flex}.manual-selection-summary b,.manual-block-details>b{font-size:11px}.manual-selection-summary small,.manual-block-details small,.manual-block-action small{color:var(--muted);font-size:7px}.manual-selection-summary em{color:#2d5545;font-size:7px;font-style:normal}.manual-reasons{flex-wrap:wrap;gap:5px;display:flex}.manual-reasons button{border:1px solid var(--line);color:var(--ink);background:#fff;border-radius:7px;padding:7px 9px;font-size:7px}.manual-reasons button.active{color:#07893e;background:#e9faef;border-color:#0cbf51;font-weight:800}.manual-block-details label{flex-direction:column;gap:5px;font-size:7px;display:flex}.manual-block-details input{border:1px solid var(--line);border-radius:7px;padding:9px;font-size:8px}.manual-block-action{flex-direction:column;justify-content:center;gap:9px;display:flex}.manual-block-action .primary{margin:0}.manual-block-action .primary:disabled{opacity:.45}.manual-block-action small{text-align:center;line-height:1.5}.manual-legend{border:1px solid var(--line);background:#fff;border-radius:10px;flex-wrap:wrap;gap:17px;margin-top:12px;padding:11px 13px;display:flex}.manual-legend span{align-items:center;gap:6px;font-size:7px;display:flex}.manual-legend span:before{content:"";background:#eff9f1;border:1px solid #cfe7d5;border-radius:3px;width:13px;height:13px}.manual-legend .picked:before{background:#04b64a;border-color:#02963c}.manual-legend .booking:before{background:#fff0ec;border-color:#ffb5a4}.manual-legend .openplay:before{background:#f1edff;border-color:#cdc3ff}.manual-legend .blocked:before{background:#eef0ef;border-color:#d5dbd8}.manual-legend .lapsed:before{background:#f5f6f5;border-color:#e3e6e4}@media (width<=900px){.manual-date-strip{grid-template-columns:repeat(4,1fr)}.manual-block-footer{grid-template-columns:1fr 1fr}.manual-block-action{grid-column:1/-1}.owner-settings>.panel:nth-child(2){grid-column:auto}}@media (width<=600px){.manual-date-strip{padding-bottom:5px;display:flex;overflow-x:auto}.manual-date-strip button{min-width:92px;min-height:96px}.manual-block-footer{grid-template-columns:1fr}.manual-block-action{grid-column:auto}.manual-legend{gap:10px}.manual-grid-scroll{margin-left:-8px;margin-right:-8px}.manual-slot-grid{grid-template-columns:105px repeat(var(--manual-courts,8),110px)!important}}@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial}}}@layer theme{:root,:host{--font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--spacing:.25rem;--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.visible{visibility:visible}.relative{position:relative}.\!start{inset-inline-start:var(--spacing)!important}.start{inset-inline-start:var(--spacing)}.end{inset-inline-end:var(--spacing)}.block{display:block}.contents{display:contents}.flex{display:flex}.hidden{display:none}.table{display:table}.grow{flex-grow:1}.resize{resize:both}.blur{--tw-blur:blur(8px);filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}}.attendance-actions{gap:5px;display:flex}.attendance-choice{border:1px solid var(--line);color:var(--muted);white-space:nowrap;background:#fff;border-radius:6px;padding:6px 8px;font-size:7px;font-weight:900}.attendance-choice.present.active{color:#078d43;background:#e6f9ed;border-color:#43ce7b}.attendance-choice.absent.active{color:#bd4c35;background:#fff0eb;border-color:#efa890}.registered-grid em.unchecked{color:#647873;background:#edf2f0}.registered-grid em.absent{color:#bd4c35;background:#fff0eb}.live-session-bar{background:#eefbf3;border:1px solid #55d487;border-radius:13px;justify-content:space-between;align-items:center;gap:20px;margin:18px 0;padding:16px 18px;display:flex}.live-session-bar>div{flex-direction:column;display:flex}.live-session-bar small{letter-spacing:1.3px;color:#078d43;font-size:7px;font-weight:900}.live-session-bar h3{margin:4px 0;font-size:15px}.live-session-bar p{color:var(--muted);margin:0;font-size:8px}.live-session-bar>button,.live-round-head button{background:var(--green);color:#fff;white-space:nowrap;border:0;border-radius:8px;padding:10px 13px;font-size:8px;font-weight:900}.live-session-bar>button:disabled{opacity:.45}.live-session-bar.live{background:#e7f7ff;border-color:#70bde2}.live-session-bar.live small{color:#26759e}.live-session-bar.completed{background:#f0f4f2;border-color:#bacac5}.live-session-bar.completed small{color:#667b75}.attendance-toggle{color:#078d43;background:#e6f9ed;border:1px solid #43ce7b;border-radius:6px;padding:6px 8px;font-size:7px;font-weight:900}.attendance-toggle.absent{color:#bd4c35;background:#fff0eb;border-color:#efa890}.live-match-plan{flex-direction:column;gap:12px;display:flex}.live-round-head{color:#fff;background:linear-gradient(110deg,#05333d,#078c4a);border-radius:11px;justify-content:space-between;align-items:center;padding:14px 16px;display:flex}.live-round-head>div{flex-direction:column;gap:4px;display:flex}.live-round-head small{color:var(--lime);letter-spacing:1px;font-size:7px}.live-round-head b{font-size:15px}.live-round-head button{color:#087f41;background:#fff}.live-match{border-color:#4ccf80!important}.winner-team{box-shadow:inset 0 0 0 1px #52d285;background:#ddf8e7!important}.winner-team:before{content:"WINNER";color:#078d43;font-size:7px;font-weight:900}.result-actions{grid-template-columns:1fr 1fr;gap:7px;padding:0 12px 12px;display:grid}.result-actions button{color:#078d43;background:#effbf4;border:1px solid #43ce7b;border-radius:7px;padding:8px;font-size:8px;font-weight:900}@media (width<=650px){.live-session-bar{flex-direction:column;align-items:flex-start}.live-session-bar>button{width:100%}.live-round-head{flex-direction:column;align-items:flex-start;gap:10px}.live-round-head button{width:100%}}:root{--navy:#032c36;--green:#00c853;--lime:#baf12b;--ink:#11272c;--muted:#748689;--line:#dce6e3}*{box-sizing:border-box}body{color:var(--ink);font-family:var(--font-geist),Arial,sans-serif;background:#f0f5f2;margin:0}button,select,input{font:inherit}.shell{grid-template-columns:235px 1fr;min-height:100vh;display:grid}.rail{color:#fff;background:linear-gradient(#07333d,#031f28);flex-direction:column;height:100vh;padding:27px 18px;display:flex;position:sticky;top:0}.logo{letter-spacing:-1px;font-size:22px;font-style:italic;font-weight:900}.logo b{color:var(--lime)}.logo i{color:#ffe42c;margin-left:6px}.venue{border-bottom:1px solid #ffffff20;align-items:center;gap:10px;margin:25px 0 18px;padding-bottom:20px;display:flex}.venue>span,.user>span{color:#06323b;background:linear-gradient(135deg,#ffeecb,#16d66b);border-radius:50%;place-items:center;width:40px;height:40px;font-weight:900;display:grid}.venue div,.user div{flex-direction:column;display:flex}.venue b{font-size:11px}.venue small,.user small{color:#a9c3c7;margin-top:3px;font-size:9px}.rail nav{flex-direction:column;gap:6px;display:flex}.rail nav button{color:#b8cacc;text-align:left;cursor:pointer;background:0 0;border:0;border-radius:9px;padding:12px}.rail nav i{width:29px;font-style:normal;display:inline-block}.rail nav .active{background:var(--green);color:#fff;font-weight:800}.rail-foot{color:#afc2c5;margin-top:auto;padding-left:12px;font-size:12px;line-height:42px}.content{min-width:0;padding:0 34px 50px}.content>header{border-bottom:1px solid #d9e3e0;align-items:center;height:91px;margin-bottom:27px;display:flex}.content>header small,.panel>small,.title small{letter-spacing:1.3px;color:#82918f;font-size:9px;font-weight:800}.content>header h1{margin:4px 0 0;font-size:25px}.user{align-items:center;gap:9px;margin-left:auto;display:flex}.user b{font-size:11px}.mobile-logo{display:none}.stack{flex-direction:column;gap:20px;display:flex}.hero{color:#fff;background:radial-gradient(circle at 78% 75%,#08b45a,#084637 31%,#052d37 65%);border-radius:23px;min-height:280px;padding:36px 42px;position:relative;overflow:hidden}.hero>div:first-child>span{letter-spacing:1.2px;background:#ffffff17;border:1px solid #ffffff25;border-radius:18px;padding:6px 9px;font-size:9px}.hero h2{letter-spacing:-1.4px;margin:17px 0 12px;font-size:38px;line-height:.98}.hero h2 em{color:var(--lime);font-style:normal}.hero p{color:#bfd5d1;font-size:12px}.hero button,.primary{background:var(--green);color:#fff;cursor:pointer;border:0;border-radius:9px;margin-right:8px;padding:12px 19px;font-weight:800}.hero .white{color:var(--navy);background:#fff}.ball{background:radial-gradient(circle at 34% 30%,#edff74,var(--lime) 47%,#6fb719);color:#386a1c;letter-spacing:14px;overflow-wrap:anywhere;border-radius:50%;width:245px;height:245px;padding:85px 58px;font-size:29px;position:absolute;bottom:-65px;right:8%;transform:rotate(-12deg);box-shadow:-20px 0 60px #70ff6a33}.stats,.kpis{grid-template-columns:repeat(4,1fr);gap:13px;display:grid}.stats article,.kpis article{border:1px solid var(--line);background:#fff;border-radius:14px;flex-direction:column;padding:18px 20px;display:flex}.stats small,.kpis small{color:var(--muted);font-size:10px}.stats b,.kpis b{margin:4px 0;font-size:26px}.stats em,.kpis em{color:#0bb156;font-size:9px;font-style:normal}.two,.book-layout,.open-layout,.admin-grid{grid-template-columns:1.15fr .85fr;gap:20px;display:grid}.panel{border:1px solid var(--line);background:#fff;border-radius:17px;padding:21px;box-shadow:0 6px 25px #254b4008}.title h3{margin:4px 0 14px;font-size:16px}.booking{border:1px solid var(--line);border-radius:11px;grid-template-columns:59px 1fr auto;align-items:center;gap:12px;padding:10px;display:grid}.booking>span,.game-img{color:#fff;background:linear-gradient(145deg,#0e5c52,#65d57b);border-radius:8px;place-items:center;width:59px;height:54px;font-weight:900;display:grid}.booking b{font-size:11px}.booking p{color:var(--muted);margin:4px 0;font-size:9px}.booking em{color:#08a84b;background:#dcf9e6;border-radius:4px;padding:4px 6px;font-size:8px;font-style:normal}.quick{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.quick button{border:1px solid var(--line);text-align:left;color:var(--green);cursor:pointer;background:#f9fbfa;border-radius:11px;flex-direction:column;padding:12px;font-size:19px;display:flex}.quick b{color:var(--ink);margin-top:8px;font-size:10px}.quick small{color:var(--muted);margin-top:3px;font-size:8px}.cover{color:#fff;background:linear-gradient(90deg,#052e39de,#0da6656b),repeating-linear-gradient(120deg,#116b55 0 27px,#16778a 28px 54px);border-radius:13px;flex-direction:column;justify-content:flex-end;height:174px;padding:23px;display:flex}.cover small{letter-spacing:1.2px;font-size:8px}.cover h2{margin:5px 0}.cover p{margin:0;font-size:10px}.dates,.times,.filters{gap:7px;margin:15px 0;display:flex}.dates button,.times button,.filters button{border:1px solid var(--line);background:#fff;border-radius:8px;flex:1;padding:9px 5px;font-size:10px}.selected,.filters .active{background:var(--green)!important;color:#fff!important;border-color:var(--green)!important}.panel>h3{margin:18px 0 8px;font-size:13px}.courts{flex-direction:column;gap:7px;display:flex}.courts button{border:1px solid var(--line);background:#fff;border-radius:8px;justify-content:space-between;padding:11px;font-size:10px;display:flex}.courts .available b{color:#0aaf4e}.courts .booked{color:#a1aaa9;background:#fff7f4}.courts .booked b{color:#e87761}.summary{align-self:start;position:sticky;top:20px}.summary h2{margin:5px 0 16px}.summary-box{background:#f1f7f4;border-radius:10px;flex-direction:column;padding:15px;display:flex}.summary-box b{font-size:12px}.summary-box span,.summary-box p{color:var(--muted);margin:3px 0;font-size:9px}.line{border-bottom:1px solid var(--line);justify-content:space-between;padding:11px 2px;font-size:11px;display:flex}.line.total{border:0;font-size:14px}.summary h4{letter-spacing:1.2px;color:#82918f;margin:15px 0 7px;font-size:9px}.pay{border:1px solid var(--line);border-radius:8px;gap:7px;margin:6px 0;padding:10px;font-size:10px;display:flex}.pay span{color:var(--green);margin-left:auto}.primary{width:100%;margin-top:12px}.primary:disabled{background:#6fcb95}.secure{text-align:center;color:#8b9b99;margin-top:8px;font-size:8px;display:block}.games{flex-direction:column;gap:9px;display:flex}.games article{border:1px solid var(--line);background:#fff;border-radius:12px;grid-template-columns:59px 1fr auto;align-items:center;gap:11px;padding:10px;display:grid}.games h3{margin:0;font-size:12px}.games p,.games b,.games small{color:var(--muted);margin:4px 0;font-size:8px;display:block}.games b{color:var(--ink)}.games article>button{background:var(--green);color:#fff;border:0;border-radius:7px;padding:9px 14px;font-size:10px;font-weight:800}.games article>button:disabled{background:#c6d3ce}.form label{flex-direction:column;gap:6px;margin:11px 0;font-size:9px;font-weight:700;display:flex}.form select{border:1px solid var(--line);background:#fff;border-radius:7px;padding:9px;font-size:10px}.form-two{grid-template-columns:.7fr 1.3fr;gap:7px;display:grid}.choices{gap:5px;display:flex}.choices button{border:1px solid var(--line);background:#fff;border-radius:6px;flex:1;padding:7px 3px;font-size:8px}.choices .active{background:var(--green);color:#fff;border-color:var(--green)}.admin-grid{grid-template-columns:1.1fr .9fr}.court-overview{grid-template-columns:repeat(4,1fr);gap:7px;display:grid}.court-overview article{border:1px solid;border-radius:9px;flex-direction:column;padding:11px 8px;display:flex}.court-overview small,.court-overview em{font-size:8px;font-style:normal}.court-overview b{margin:4px 0;font-size:10px}.court-overview .available{color:#087c3e;background:#e9faef;border-color:#69d895}.court-overview .booked{color:#cc5738;background:#fff0eb;border-color:#ffad90}.court-overview+.title{margin-top:22px}.table>div{border-top:1px solid var(--line);grid-template-columns:55px 55px 1fr 45px;align-items:center;padding:10px 0;font-size:9px;display:grid}.table p{margin:0}.table em{color:#08a64a;text-align:center;background:#e5f8ec;border-radius:5px;padding:4px;font-style:normal}.chart-panel>p{color:#0aae4e;font-size:9px}.chart{border-bottom:1px solid var(--line);background:repeating-linear-gradient(#fff 0 44px,#edf2ef 45px);align-items:flex-end;gap:9px;height:225px;display:flex}.chart i{background:linear-gradient(#00d65c,#b9ee29);border-radius:5px 5px 0 0;flex:1}.axis{color:var(--muted);justify-content:space-between;margin-top:8px;font-size:7px;display:flex}.mobile-nav{display:none}.toast{color:#fff;z-index:20;background:#06313a;border-radius:11px;padding:14px 18px;font-size:11px;position:fixed;bottom:25px;right:25px;box-shadow:0 10px 35px #06313a55}@media (width<=900px){.shell{display:block}.rail{display:none}.content{padding:0 15px 88px}.content>header{height:76px;margin-bottom:17px}.mobile-logo{margin-right:12px;display:block}.mobile-logo .logo{font-size:16px}.content>header>div:nth-child(2)>small{display:none}.content>header h1{font-size:18px}.user div{display:none}.hero{min-height:315px;padding:28px 23px}.hero h2{font-size:34px}.hero p{max-width:215px}.ball{width:168px;height:168px;padding:58px 37px;font-size:20px;bottom:-25px;right:-40px}.stats,.kpis{grid-template-columns:repeat(2,1fr)}.two,.book-layout,.open-layout,.admin-grid{grid-template-columns:1fr}.summary{position:static}.mobile-nav{border-top:1px solid var(--line);z-index:10;height:70px;padding-bottom:env(safe-area-inset-bottom);background:#fff;grid-template-columns:repeat(5,1fr);align-items:center;display:grid;position:fixed;bottom:0;left:0;right:0}.mobile-nav button{color:#738487;background:0 0;border:0;flex-direction:column;align-items:center;font-size:18px;display:flex}.mobile-nav small{margin-top:3px;font-size:7px}.mobile-nav .active{color:var(--green)}.mobile-nav .plus{background:var(--green);color:#fff;border-radius:50%;justify-self:center;width:47px;height:47px;font-size:26px;box-shadow:0 7px 20px #00b94f55}.quick{grid-template-columns:1fr}.court-overview{grid-template-columns:repeat(2,1fr)}.toast{text-align:center;bottom:82px;left:15px;right:15px}}@media (width<=520px){.hero>div>div{flex-direction:column;gap:7px;width:145px;display:flex}.hero button{margin:0}.stats article,.kpis article{padding:14px}.stats b,.kpis b{font-size:23px}.panel{padding:15px}.dates button{font-size:8px}.times{flex-wrap:wrap}.times button{min-width:52px}.filters button{padding:8px 2px;font-size:8px}.games article{grid-template-columns:51px 1fr auto}.game-img{width:51px}.games article>button{padding:8px 10px}.form-two{grid-template-columns:1fr}.table>div{grid-template-columns:48px 50px 1fr 41px}}.rail-foot button{color:#b8cacc;cursor:pointer;background:0 0;border:0;padding:0}.rank-layout,.profile-layout{grid-template-columns:1.15fr .85fr;gap:20px;display:grid}.rank-tabs{gap:7px;margin-bottom:13px;display:flex}.rank-tabs button{border:1px solid var(--line);background:#fff;border-radius:7px;padding:7px 16px;font-size:9px}.rank-tabs .active{background:var(--green);color:#fff}.rank-list{flex-direction:column;gap:7px;display:flex}.rank-list article{border:1px solid var(--line);border-radius:10px;grid-template-columns:35px 39px 1fr auto;align-items:center;gap:10px;padding:10px;display:grid}.rank-list article>span,.profile-avatar{background:linear-gradient(135deg,#f8edc3,#0fd36b);border-radius:50%;place-items:center;font-weight:800;display:grid}.rank-list article>span{width:39px;height:39px;font-size:10px}.rank-list article>div{flex-direction:column;display:flex}.rank-list article b{font-size:11px}.rank-list article small{color:var(--muted);font-size:8px}.rank-list article em{color:#eeae00;font-size:10px;font-style:normal}.rank-list .me{background:#e8faf0;border-color:#52d789}.rank-card{text-align:center}.rank-card>small{color:var(--muted);font-size:9px}.rank-card>b{color:var(--green);margin:10px;font-size:54px;display:block}.rank-card h3{margin:0}.rank-card p{color:var(--muted);font-size:10px}.rank-card>div{border:1px solid var(--line);border-radius:10px;grid-template-columns:repeat(3,1fr);margin:20px 0;display:grid}.rank-card>div span{flex-direction:column;padding:12px 5px;display:flex}.rank-card>div span+span{border-left:1px solid var(--line)}.rank-card>div b{font-size:18px}.rank-card>div small{color:var(--muted);font-size:8px}.profile-card{text-align:center}.profile-avatar{width:90px;height:90px;margin:5px auto 14px;font-size:25px}.profile-card h2{margin:0}.profile-card p{color:var(--muted);font-size:11px}.profile-card>span{color:#099b49;background:#e4f9ec;border-radius:18px;padding:7px 12px;font-size:9px}.profile-card>button{border:1px solid var(--green);color:var(--green);background:#fff;border-radius:8px;margin:22px auto 0;padding:9px 22px;font-size:10px;font-weight:800;display:block}.details{grid-template-columns:1fr 1fr;gap:9px;margin-bottom:24px;display:grid}.details label{color:var(--muted);background:#f5f8f7;border-radius:8px;flex-direction:column;padding:11px;font-size:8px;display:flex}.details b{color:var(--ink);margin-top:4px;font-size:10px}.profile-actions{grid-template-columns:repeat(3,1fr);gap:7px;display:grid}.profile-actions button{border:1px solid var(--line);color:var(--ink);background:#fff;border-radius:8px;padding:12px 5px;font-size:9px}@media (width<=900px){.rank-layout,.profile-layout{grid-template-columns:1fr}.rank-card{order:-1}.profile-actions{grid-template-columns:1fr}}.auth-page{background:#eef5f1;grid-template-columns:1fr 480px;min-height:100vh;display:grid}.auth-brand{color:#fff;background:radial-gradient(circle at 70% 75%,#0ab95b,#064737 34%,#042a34 70%);flex-direction:column;justify-content:center;padding:60px 8vw;display:flex;position:relative;overflow:hidden}.auth-brand>.logo{font-size:28px;position:absolute;top:45px;left:8vw}.auth-brand>span{letter-spacing:2px;color:var(--lime);font-size:9px;font-weight:800}.auth-brand h1{letter-spacing:-2px;margin:18px 0;font-size:58px;line-height:.98}.auth-brand p{color:#c4d7d3;max-width:420px;font-size:14px}.auth-ball{background:radial-gradient(circle at 34% 30%,#efff78,var(--lime) 48%,#69ad16);color:#3d731b;letter-spacing:17px;overflow-wrap:anywhere;border-radius:50%;width:290px;height:290px;padding:102px 70px;font-size:34px;position:absolute;bottom:-75px;right:-85px;transform:rotate(-12deg)}.auth-card{background:#fff;flex-direction:column;justify-content:center;padding:48px 45px;display:flex;overflow:auto}.auth-head small{letter-spacing:1.5px;color:var(--green);font-size:9px;font-weight:900}.auth-head h2{margin:6px 0;font-size:28px}.auth-head p{color:var(--muted);margin:0 0 17px;font-size:11px}.role-switch{background:#eff5f2;border-radius:9px;grid-template-columns:1fr 1fr;margin-bottom:12px;padding:4px;display:grid}.role-switch button{background:0 0;border:0;border-radius:7px;padding:9px;font-size:10px}.role-switch .active{color:var(--green);background:#fff;font-weight:800;box-shadow:0 2px 8px #173f3415}.auth-card form{flex-direction:column;gap:9px;display:flex}.auth-card form label{flex-direction:column;gap:5px;font-size:9px;font-weight:700;display:flex}.auth-card input,.auth-card select,.auth-card textarea{border:1px solid var(--line);color:var(--ink);background:#fff;border-radius:8px;padding:10px 11px;font-size:11px}.auth-card textarea{resize:vertical;min-height:58px}.auth-card .primary{margin:5px 0 0}.auth-toggle{color:var(--green);background:0 0;border:0;margin-top:14px;font-size:10px;font-weight:800}.auth-error{color:#bc4635;background:#fff0ed;border:1px solid #ffc5b8;border-radius:7px;padding:9px;font-size:9px}.loading-card{text-align:center;grid-column:1/-1;align-items:center}.loading-card .logo{color:var(--navy);margin-bottom:30px}.loading-dot{color:var(--green);font-size:32px;animation:1s infinite pulse}.loading-card p{color:var(--muted);font-size:11px}@keyframes pulse{50%{opacity:.5}}.user-table>div{border-top:1px solid var(--line);grid-template-columns:1.1fr 1.3fr .6fr .6fr;align-items:center;gap:10px;padding:11px 6px;font-size:9px;display:grid}.user-table>div:first-child{color:var(--muted);border:0}.user-table em{text-transform:capitalize;color:#08a84b;text-align:center;background:#e5f9ed;border-radius:5px;padding:5px;font-style:normal}@media (width<=760px){.auth-page{background:#fff;display:block}.auth-brand{min-height:220px;padding:85px 25px 30px}.auth-brand>.logo{top:25px;left:25px}.auth-brand h1{font-size:36px}.auth-brand p{max-width:250px}.auth-ball{width:145px;height:145px;padding:49px 32px;font-size:17px;bottom:-38px;right:-40px}.auth-card{min-height:calc(100vh - 220px);padding:30px 22px}.user-table>div{grid-template-columns:1fr 1fr}.user-table>div>:nth-child(3),.user-table>div>:nth-child(4){display:none}}.booking-controls{grid-template-columns:1fr 1fr;gap:10px;margin:16px 0;display:grid}.booking-controls label,.settings-form label{flex-direction:column;gap:6px;font-size:9px;font-weight:700;display:flex}.booking-controls select,.booking-controls input,.settings-form input,.settings-form select{border:1px solid var(--line);background:#fff;border-radius:8px;padding:10px;font-size:10px}.slot-grid{grid-template-columns:repeat(3,1fr);gap:7px;display:grid}.slot-grid button{border:1px solid var(--line);background:#fff;border-radius:8px;padding:9px 5px;font-size:9px}.empty-state{color:var(--muted);font-size:10px}.milestone-note{color:#667b7c;background:#eff7f3;border-radius:8px;padding:11px;font-size:9px;line-height:1.5}.hold-box{background:#e8faef;border:1px solid #55d588;border-radius:9px;flex-direction:column;margin-top:12px;padding:13px;display:flex}.hold-box b{color:#078e43;font-size:14px}.hold-box span{text-transform:uppercase;margin-top:5px;font-size:9px;font-weight:800}.hold-box p{color:var(--muted);margin:4px 0;font-size:9px}.owner-settings{grid-template-columns:1fr 1fr;gap:20px;display:grid}.settings-form{grid-template-columns:1fr 1fr;gap:12px;display:grid}.settings-form fieldset{border:0;grid-column:1/-1;margin:0;padding:0}.settings-form legend{margin-bottom:6px;font-size:9px;font-weight:700}.settings-form .primary,.settings-form .auth-error{grid-column:1/-1}.settings-form.single{grid-template-columns:1fr}.settings-form.single .primary{grid-column:auto}.day-picker{grid-template-columns:repeat(7,1fr);gap:5px;display:grid}.day-picker button{border:1px solid var(--line);background:#fff;border-radius:7px;padding:8px 2px;font-size:8px}.day-picker .active{background:var(--green);border-color:var(--green);color:#fff}.panel-intro{color:var(--muted);margin-top:-5px;font-size:9px;line-height:1.5}.payment-connect{text-align:center;padding:25px 10px}.payment-connect>span{color:#efaa25;font-size:45px}.payment-connect h3{margin:8px}.payment-connect p{color:var(--muted);font-size:9px;line-height:1.5}.payment-connect button{color:#82908d;background:#dce7e3;border:0;border-radius:8px;padding:10px 15px;font-size:9px}.real-table>div{grid-template-columns:80px 65px 1fr 80px}.real-table em{text-transform:capitalize}@media (width<=900px){.owner-settings{grid-template-columns:1fr}.slot-grid{grid-template-columns:repeat(2,1fr)}}@media (width<=520px){.booking-controls,.settings-form{grid-template-columns:1fr}.settings-form fieldset,.settings-form .primary,.settings-form .auth-error{grid-column:auto}.day-picker{grid-template-columns:repeat(4,1fr)}.real-table>div{grid-template-columns:70px 55px 1fr}.real-table em{display:none}}.owner-success{color:#078d43;background:#e5faed;border:1px solid #55d78a;border-radius:9px;padding:11px 14px;font-size:10px}.owner-bookings{flex-direction:column;display:flex}.owner-bookings article{border-top:1px solid var(--line);justify-content:space-between;align-items:center;gap:15px;padding:12px 0;display:flex}.owner-bookings article>div:first-child{flex-direction:column;gap:4px;display:flex}.owner-bookings article b{font-size:10px}.owner-bookings article span,.owner-bookings article small{color:var(--muted);font-size:8px}.booking-state{align-items:center;gap:8px;display:flex}.booking-state em{text-transform:capitalize;white-space:nowrap;border-radius:6px;padding:6px 8px;font-size:8px;font-style:normal}.booking-state em.unpaid{color:#aa7510;background:#fff4d9}.booking-state em.paid{color:#078f43;background:#e3f9eb}.booking-state button{background:var(--green);color:#fff;white-space:nowrap;border:0;border-radius:7px;padding:8px 10px;font-size:8px;font-weight:800}.payment-method-info{flex-direction:column;gap:10px;display:flex}.payment-method-info article{border:1px solid var(--line);border-radius:10px;grid-template-columns:38px 1fr;gap:10px;padding:13px;display:grid}.payment-method-info article>span{color:#08a44c;background:#e7f9ed;border-radius:50%;place-items:center;width:38px;height:38px;font-weight:900;display:grid}.payment-method-info b{font-size:10px}.payment-method-info p{color:var(--muted);margin:4px 0;font-size:8px;line-height:1.5}@media (width<=520px){.owner-bookings article{flex-direction:column;align-items:flex-start}.booking-state{justify-content:space-between;width:100%}}.player-bookings{flex-direction:column;gap:8px;display:flex}.player-bookings .booking>div{min-width:0}.player-bookings .booking small{color:var(--muted);margin-top:7px;font-size:7px;display:block}.player-bookings .booking em.unpaid{color:#9b6b09;background:#fff1c9}.booking-empty{border:1px dashed var(--line);border-radius:11px;justify-content:center;align-items:center;gap:14px;min-height:82px;padding:18px;display:flex}.booking-empty p{color:var(--muted);font-size:10px}.booking-empty button{background:var(--green);color:#fff;cursor:pointer;border:0;border-radius:8px;padding:9px 13px;font-size:9px;font-weight:800}@media (width<=520px){.player-bookings .booking{grid-template-columns:48px 1fr}.player-bookings .booking>span{width:48px;height:48px}.player-bookings .booking>strong{grid-column:2}.booking-empty{flex-direction:column;align-items:flex-start}}.payment-option{text-align:left;border:1px solid var(--line);background:#fff;border-radius:9px;grid-template-columns:34px 1fr auto;align-items:center;gap:10px;width:100%;margin:7px 0;padding:11px;display:grid}.payment-option>span{color:#079447;background:#e6faed;border-radius:50%;place-items:center;width:34px;height:34px;font-weight:900;display:grid}.payment-option div{flex-direction:column;gap:3px;display:flex}.payment-option b{font-size:10px}.payment-option small{color:var(--muted);font-size:8px}.payment-option i{color:var(--muted);font-size:8px;font-style:normal}.payment-option.selected-payment{background:#f2fcf6;border-color:#4fd184}.payment-option.selected-payment i{color:#079447;font-size:14px}.payment-option:disabled{opacity:.58}.cash-reserved{background:#effbf4;border:1px solid #55d589;border-radius:11px;margin-top:12px;padding:14px}.cash-reserved-head{align-items:center;gap:10px;display:flex}.cash-reserved-head>span{background:var(--green);color:#fff;border-radius:50%;place-items:center;width:34px;height:34px;font-weight:900;display:grid}.cash-reserved-head div{flex-direction:column;display:flex}.cash-reserved-head b{font-size:11px}.cash-reserved-head small{color:var(--muted);margin-top:2px;font-size:8px}.cash-reserved>strong{color:#078f43;margin:13px 0 4px;font-size:15px;display:block}.cash-reserved>p{color:#4f6966;font-size:9px;line-height:1.5}.cash-reserved>em{color:#a26f08;background:#fff3cd;border-radius:6px;padding:8px;font-size:8px;font-style:normal;display:block}.booking-page-head{color:#fff;background:linear-gradient(115deg,#05323c,#078a4a);border-radius:17px;justify-content:space-between;align-items:center;padding:24px 27px;display:flex}.booking-page-head small{letter-spacing:1.4px;color:var(--lime);font-size:8px;font-weight:900}.booking-page-head h2{margin:5px 0;font-size:25px}.booking-page-head p{color:#c8dcd7;margin:0;font-size:10px}.booking-page-head button{background:var(--green);color:#fff;border:0;border-radius:8px;padding:11px 15px;font-size:9px;font-weight:800}.booking-list-head,.booking-history article{grid-template-columns:1.25fr 1fr 1.1fr .5fr 70px;align-items:center;gap:12px;display:grid}.booking-list-head{color:var(--muted);padding:0 10px 10px;font-size:8px}.booking-history article{border-top:1px solid var(--line);padding:13px 10px}.booking-history article>div{flex-direction:column;gap:4px;display:flex}.booking-history strong{font-size:10px}.booking-history span{color:var(--muted);font-size:8px}.booking-history em{text-transform:capitalize;border-radius:6px;width:max-content;padding:5px 7px;font-size:8px;font-style:normal}.booking-history em.paid{color:#078e43;background:#e4f9ec}.booking-history em.unpaid{color:#a66e07;background:#fff2ce}.booking-history article.cancelled{opacity:.55}.cancel-booking{color:#c6533b;background:#fff5f2;border:1px solid #ffb6a6;border-radius:7px;padding:7px 9px;font-size:8px}.locked-status{text-align:center}.booking-history .booking-empty{margin-top:8px}@media (width<=760px){.booking-page-head{flex-direction:column;align-items:flex-start;gap:15px}.booking-list-head{display:none}.booking-history article{grid-template-columns:1fr auto}.booking-history article>div:nth-child(2),.booking-history article>div:nth-child(3){grid-column:1}.booking-history article>strong{grid-area:1/2}.booking-history article>button,.booking-history article>.locked-status{grid-area:2/2}.booking-history article>div:nth-child(3) span{display:none}}.open-create{align-self:start}.open-create form{flex-direction:column;display:flex}.open-create input{border:1px solid var(--line);background:#fff;border-radius:7px;padding:9px;font-size:10px}.real-open-games article{grid-template-columns:59px 1fr auto}.real-open-games article>button.leave-play{color:#bd543f;background:#fff1ed;border:1px solid #ffc0b2}.open-error{margin-bottom:10px}.real-open-games .booking-empty{background:#fff}@media (width<=520px){.real-open-games article{grid-template-columns:48px 1fr}.real-open-games .game-img{width:48px;height:48px}.real-open-games article>button{grid-column:2;width:max-content}.open-create{position:static}}.field-help{color:var(--muted);font-weight:400;line-height:1.4}.multi-courts{grid-template-columns:repeat(2,1fr);gap:6px;margin-top:3px;display:grid}.multi-courts button{border:1px solid var(--line);background:#fff;border-radius:8px;justify-content:space-between;align-items:center;padding:9px;font-size:8px;display:flex}.multi-courts button b{color:#09a94d}.multi-courts button.active{color:#078d43;background:#e5faed;border-color:#49d180}.multi-courts button:disabled{color:#9ea9a7;background:#fff4f0}.multi-courts button:disabled b{color:#dc735d}.court-count{color:#078d43;margin-top:5px;font-size:8px;font-style:normal}@media (width<=520px){.multi-courts{grid-template-columns:1fr}}.section-row{justify-content:space-between;align-items:flex-start;display:flex}.section-row>button{color:#08a64a;background:0 0;border:0;font-size:9px;font-weight:800}.recruit-grid{grid-template-columns:repeat(3,1fr);gap:9px;display:grid}.recruit-grid article{border:1px solid var(--line);border-radius:10px;grid-template-columns:38px 1fr auto;align-items:center;gap:9px;padding:11px;display:grid}.recruit-grid article>span,.recruit-main>span{color:#fff;background:linear-gradient(145deg,#0e5c52,#65d57b);border-radius:8px;place-items:center;width:38px;height:38px;font-size:10px;font-weight:900;display:grid}.recruit-grid article div{flex-direction:column;min-width:0;display:flex}.recruit-grid b{font-size:9px}.recruit-grid p,.recruit-grid small{color:var(--muted);margin:3px 0;font-size:7px}.recruit-grid article>button{background:var(--green);color:#fff;border:0;border-radius:6px;padding:7px 8px;font-size:8px}.recruit-list{flex-direction:column;gap:10px;display:flex}.recruit-list>article{border:1px solid var(--line);background:#fff;border-radius:14px;justify-content:space-between;gap:18px;padding:16px;display:flex}.recruit-main{grid-template-columns:45px 1fr;gap:12px;display:grid}.recruit-main>span{width:45px;height:45px}.recruit-main h3{margin:0;font-size:13px}.recruit-main p{color:#36534f;margin:5px 0;font-size:10px}.recruit-main small,.recruit-main b{color:var(--muted);text-transform:capitalize;margin-top:5px;font-size:8px;display:block}.recruit-action{flex-direction:column;align-items:flex-end;min-width:120px;display:flex}.recruit-action strong{font-size:16px}.recruit-action small,.recruit-action em{color:var(--muted);margin:2px 0;font-size:8px;font-style:normal}.recruit-action button,.invite-row button,.host-player-list button{background:var(--green);color:#fff;border:0;border-radius:7px;margin-top:7px;padding:8px 10px;font-size:8px;font-weight:800}.recruit-action button:disabled{background:#c9d7d2}.host-open-grid{grid-template-columns:.7fr 1.3fr;gap:20px;display:grid}.host-session-list{flex-direction:column;gap:6px;display:flex}.host-session-list button{text-align:left;border:1px solid var(--line);background:#fff;border-radius:8px;flex-direction:column;gap:4px;padding:10px;display:flex}.host-session-list button.active{background:#edfbf2;border-color:#39cd78}.host-session-list b{font-size:10px}.host-session-list span{color:var(--muted);font-size:8px}.open-summary{background:#e9faf0;border:1px solid #5bd58c;border-radius:9px;flex-direction:column;padding:12px;display:flex}.open-summary b{color:#087f40;font-size:11px}.open-summary span{color:var(--muted);margin-top:4px;font-size:8px}.invite-row{grid-template-columns:1fr auto;gap:8px;margin:12px 0;display:grid}.invite-row select{border:1px solid var(--line);background:#fff;border-radius:7px;padding:8px;font-size:9px}.invite-row button{margin:0}.host-player-list{flex-direction:column;display:flex}.host-player-list article{border-top:1px solid var(--line);grid-template-columns:34px 1fr auto auto;align-items:center;gap:9px;padding:9px 0;display:grid}.host-player-list article>span{color:#078b43;background:#dff8e8;border-radius:50%;place-items:center;width:34px;height:34px;font-size:9px;font-weight:900;display:grid}.host-player-list article>div{flex-direction:column;display:flex}.host-player-list b{font-size:9px}.host-player-list small{color:var(--muted);font-size:7px}.host-player-list em{text-transform:capitalize;background:#edf3f1;border-radius:5px;padding:5px 7px;font-size:8px;font-style:normal}.host-player-list em.confirmed{color:#078c42;background:#e3f9eb}.host-player-list em.pending{color:#a66d07;background:#fff2ce}.host-player-list em.invited{color:#3b67a9;background:#eaf2ff}.host-player-list button{margin:0}.host-create-only .open-layout>section{display:none}.host-create-only .open-layout{display:block}.host-create-only .open-create{box-shadow:none;border:0;padding:0}.profile-stats{grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:20px;display:grid}.profile-stats article{border:1px solid var(--line);border-radius:10px;flex-direction:column;padding:11px;display:flex}.profile-stats small{color:var(--muted);font-size:8px}.profile-stats b{margin:3px 0;font-size:20px}.profile-stats em{color:#09a64c;font-size:7px;font-style:normal}@media (width<=900px){.recruit-grid,.host-open-grid{grid-template-columns:1fr}}@media (width<=520px){.recruit-list>article{flex-direction:column}.recruit-action{align-items:flex-start}.invite-row{grid-template-columns:1fr}.profile-stats{grid-template-columns:repeat(2,1fr)}.host-player-list article{grid-template-columns:34px 1fr auto}.host-player-list button{grid-column:2}}.host-create-form,.cancel-center form{flex-direction:column;gap:11px;display:flex}.host-create-form label,.cancel-center label{flex-direction:column;gap:6px;font-size:9px;font-weight:700;display:flex}.host-create-form input,.host-create-form select,.host-create-form textarea,.cancel-center select,.cancel-center textarea{border:1px solid var(--line);font:inherit;color:var(--ink);background:#fff;border-radius:8px;padding:10px}.host-create-form textarea,.cancel-center textarea{resize:vertical;min-height:82px}.cancel-center{border-color:#f0c6bd}.pending-review{background:#fff3d7;border:1px solid #f3ce75;border-radius:9px;flex-direction:column;gap:5px;padding:13px;display:flex}.pending-review b{color:#966408;font-size:10px}.pending-review span{color:#705d37;font-size:9px}.danger-action{color:#fff;background:#cf563e;border:0;border-radius:8px;align-self:flex-start;padding:10px 14px;font-size:9px;font-weight:800}.cancellation-list{flex-direction:column;display:flex}.cancellation-list article{border-top:1px solid var(--line);grid-template-columns:1fr auto auto;align-items:center;gap:14px;padding:13px 0;display:grid}.cancellation-list article>div:first-child{flex-direction:column;gap:4px;display:flex}.cancellation-list b{font-size:11px}.cancellation-list span,.cancellation-list small{color:var(--muted);font-size:8px}.cancellation-list p{margin:3px 0;font-size:9px}.cancellation-list em{text-transform:capitalize;border-radius:6px;padding:6px 9px;font-size:8px;font-style:normal}.cancellation-list em.pending{color:#a66e07;background:#fff2ce}.cancellation-list em.approved{color:#078f43;background:#e3f9eb}.cancellation-list em.rejected{color:#bc4635;background:#fff0ed}.review-actions{gap:6px;display:flex}.review-actions button{background:var(--green);color:#fff;border:0;border-radius:7px;padding:8px 11px;font-size:8px;font-weight:800}.review-actions button+button{color:#bc4635;background:#fff0ed;border:1px solid #ffc5b8}@media (width<=700px){.cancellation-list article{grid-template-columns:1fr auto}.review-actions{grid-column:1/-1}}.host-booking-summary{background:#f1fbf5;border:1px solid #55d589;border-radius:12px;padding:15px}.host-booking-summary .title h3{margin-bottom:10px}.summary-session{border:1px solid var(--line);background:#fff;border-radius:8px;flex-direction:column;gap:4px;margin-bottom:8px;padding:11px;display:flex}.summary-session b{font-size:11px}.summary-session span,.summary-session small{color:var(--muted);font-size:8px}.host-booking-summary .line{border-bottom:1px solid #dcebe2;justify-content:space-between;gap:15px;padding:8px 2px;font-size:9px;display:flex}.host-booking-summary .line.total{border-bottom:0;font-size:12px}.host-booking-summary>p{color:#58706b;margin:8px 0 0;font-size:8px;line-height:1.5}.booking-state button.owner-cancel{color:#bc4635;background:#fff0ed;border:1px solid #ffc5b8}.court-overview .reserved{color:#bd542d;background:#fff1e9;border-color:#ffad83}.court-overview .held{color:#916b08;background:#fff8df;border-color:#eacb64}.court-overview article em{line-height:1.35}.owner-fee-note{background:#fff8e5;border:1px solid #f0d68b;border-radius:8px;flex-direction:column;gap:3px;margin-top:8px;padding:10px;display:flex}.owner-fee-note b{color:#8b6508;font-size:9px}.owner-fee-note span{color:#756744;font-size:8px;line-height:1.45}.host-payment-method h4{letter-spacing:1.2px;color:#82918f;margin:3px 0 7px;font-size:9px}.host-event-head{color:#fff;background:linear-gradient(115deg,#05323c,#078a4a);border-radius:17px;justify-content:space-between;align-items:flex-end;gap:22px;padding:24px 27px;display:flex}.host-event-head>div{flex-direction:column;display:flex}.host-event-head small{letter-spacing:1.4px;color:var(--lime);font-size:8px;font-weight:900}.host-event-head h2{margin:5px 0;font-size:24px}.host-event-head p{color:#e4f4ed;margin:0 0 7px;font-size:11px}.host-event-head span{color:#bad7cc;font-size:8px}.host-event-head label{flex-direction:column;gap:5px;min-width:260px;font-size:8px;display:flex}.host-event-head select{color:var(--ink);background:#fff;border:1px solid #ffffff45;border-radius:8px;padding:9px}.registered-grid{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.registered-grid article{border:1px solid var(--line);border-radius:9px;grid-template-columns:32px 1fr auto;align-items:center;gap:9px;padding:10px;display:grid}.registered-grid article>span{color:#078d43;background:#e4f9ec;border-radius:50%;place-items:center;width:32px;height:32px;font-size:9px;font-weight:900;display:grid}.registered-grid article>div{flex-direction:column;gap:3px;display:flex}.registered-grid b{font-size:9px}.registered-grid small{color:var(--muted);font-size:7px}.registered-grid em{color:#078d43;background:#e4f9ec;border-radius:5px;padding:5px;font-size:7px;font-style:normal}.suggested-matches{grid-template-columns:repeat(2,1fr);gap:10px;display:grid}.suggested-matches>article{border:1px solid var(--line);border-radius:11px;overflow:hidden}.suggested-matches header{background:#f0f6f3;justify-content:space-between;padding:9px 11px;display:flex}.suggested-matches header b{font-size:9px}.suggested-matches header span{color:#078d43;font-size:8px}.match-teams{grid-template-columns:1fr 35px 1fr;align-items:center;gap:8px;padding:13px;display:grid}.match-teams>div{background:#f8fbf9;border-radius:8px;flex-direction:column;gap:4px;padding:10px;display:flex}.match-teams small{color:var(--muted);font-size:7px}.match-teams b{font-size:9px}.match-teams>strong{text-align:center;color:var(--green);font-size:10px}.unassigned-note{color:#8a680e;background:#fff8df;border-radius:7px;margin-bottom:0;padding:8px;font-size:8px}@media (width<=900px){.registered-grid{grid-template-columns:repeat(2,1fr)}.suggested-matches{grid-template-columns:1fr}}@media (width<=600px){.host-event-head{flex-direction:column;align-items:flex-start}.host-event-head label{width:100%;min-width:0}.registered-grid,.match-teams{grid-template-columns:1fr}.match-teams>strong{padding:3px}}.my-bookings-workspace{grid-template-columns:minmax(320px,.68fr) minmax(0,1.32fr);align-items:start;gap:18px;display:grid}.booking-hub-list{position:sticky;top:20px}.booking-hub-list .section-row{gap:12px}.booking-hub-list .section-row>button,.open-detail-empty>button{background:var(--green);color:#fff;white-space:nowrap;border:0;border-radius:8px;padding:9px 11px;font-size:8px;font-weight:800}.booking-hub-cards{flex-direction:column;gap:10px;display:flex}.open-play-booking-card,.court-booking-card{border:1px solid var(--line);background:#fff;border-radius:12px;padding:14px;transition:all .15s;position:relative}.open-play-booking-card.selected-card{background:#f0fbf4;border-color:#35cc73;box-shadow:0 0 0 1px #35cc7322}.open-play-booking-card>em,.court-booking-card>em{letter-spacing:.6px;color:#55706b;background:#edf3f1;border-radius:5px;padding:4px 7px;font-size:7px;font-style:normal;font-weight:900;display:inline-flex}.open-play-booking-card>em.hosting{color:#078d43;background:#ddf8e7}.open-play-booking-card>em.joined{color:#3569a7;background:#e8f1ff}.open-play-booking-card h3,.court-booking-card h3{margin:9px 0 6px;font-size:12px}.open-play-booking-card p,.court-booking-card p{color:var(--muted);margin:3px 0;font-size:8px;line-height:1.5}.open-play-booking-card>button{background:var(--green);color:#fff;border:0;border-radius:7px;width:100%;margin-top:10px;padding:8px 10px;font-size:8px;font-weight:800}.court-booking-card>strong{margin-top:8px;font-size:13px;display:block}.court-booking-card>span{color:#078d43;text-transform:capitalize;background:#e4f9ec;border-radius:6px;width:max-content;margin-top:5px;padding:5px 7px;font-size:8px;display:block}.court-booking-card.cancelled{opacity:.58}.open-play-detail-panel{min-height:520px}.open-detail-empty{text-align:center;flex-direction:column;justify-content:center;align-items:center;min-height:450px;display:flex}.open-detail-empty>span{color:#08a64a;background:#e5f9ec;border-radius:50%;place-items:center;width:56px;height:56px;font-size:25px;display:grid}.open-detail-empty h3{margin:13px 0 4px;font-size:16px}.open-detail-empty p{max-width:330px;color:var(--muted);margin:0 0 14px;font-size:9px;line-height:1.6}.open-play-booking-detail>header{color:#fff;background:linear-gradient(115deg,#05323c,#078a4a);border-radius:14px;padding:20px 22px}.open-play-booking-detail>header small{letter-spacing:1.3px;color:var(--lime);font-size:8px;font-weight:900}.open-play-booking-detail>header h2{margin:5px 0;font-size:20px}.open-play-booking-detail>header h2 em{vertical-align:middle;color:#fff;text-transform:uppercase;background:#ffffff25;border-radius:5px;padding:5px 7px;font-size:7px;font-style:normal;display:inline-flex}.open-play-booking-detail>header p{color:#cbe2da;margin:0;font-size:8px}.open-play-booking-detail>section{border-top:1px solid var(--line);margin-top:18px;padding-top:18px}.open-play-booking-detail .registered-grid:empty:after{content:"No confirmed players yet.";color:var(--muted);font-size:9px;display:block}.host-create-page>.panel-intro{max-width:720px;margin:0 0 18px}.host-create-page .host-create-form{max-width:none}@media (width<=1050px){.my-bookings-workspace{grid-template-columns:1fr}.booking-hub-list{position:static}.open-play-detail-panel{min-height:0}}@media (width<=600px){.booking-hub-list .section-row{flex-direction:column;align-items:flex-start}.open-play-booking-detail>header{padding:17px}.open-play-booking-detail>header h2{font-size:17px}}.timeline-alerts{flex-direction:column;gap:8px;margin-bottom:16px;display:flex}.timeline-alerts article{background:#ecfbf2;border:1px solid #48d283;border-radius:11px;grid-template-columns:38px 1fr auto;align-items:center;gap:11px;padding:11px 13px;display:grid}.timeline-alerts article.upcoming{background:#fff9e7;border-color:#efca63}.timeline-alerts article.ended{background:#f4f8f6;border-color:#bfcfca}.timeline-alerts article>span{background:var(--green);color:#fff;border-radius:50%;place-items:center;width:38px;height:38px;font-weight:900;display:grid}.timeline-alerts article.upcoming>span{background:#e7a91d}.timeline-alerts article.ended>span{background:#7d918c}.timeline-alerts b{font-size:10px;display:block}.timeline-alerts p{color:var(--muted);margin:4px 0 0;font-size:8px}.timeline-alerts button{color:#69807b;cursor:pointer;background:0 0;border:0;font-size:20px;line-height:1}.court-status-legend{flex-wrap:wrap;gap:13px;margin:-4px 0 10px;display:flex}.court-status-legend span{color:#536b67;align-items:center;gap:6px;font-size:8px;display:flex}.court-status-legend i{background:#37ce76;border-radius:50%;width:9px;height:9px}.court-status-legend i.held{background:#e6a31d}.court-status-legend i.booked{background:#ef745b}.court-status-help{background:#f3f8f5;border-radius:8px;margin:0 0 12px;padding:10px}.court-status-help b{color:#173f39}.court-booking-card>span.awaiting_payment{color:#966708;background:#fff3cf}.court-booking-card>span.in_use{color:#b94630;background:#ffede8}.court-booking-card>span.completed{color:#60736f;background:#edf2f0}.court-booking-card.completed{opacity:.72}.owner-alert-panel{border:1px solid var(--line);background:#fff;border-radius:14px;padding:16px 18px}.owner-alert-panel .timeline-alerts{grid-template-columns:repeat(2,minmax(0,1fr));margin:0;display:grid}.owner-alert-panel .timeline-alerts article{grid-template-columns:38px 1fr}.owner-alert-panel .timeline-alerts article>button{display:none}@media (width<=760px){.owner-alert-panel .timeline-alerts{grid-template-columns:1fr}}.wizard-shell{max-width:1100px;margin:0 auto}.wizard-steps{grid-template-columns:repeat(4,1fr);gap:0;margin:0 0 18px;display:grid}.wizard-steps>div{color:#85948f;align-items:center;gap:8px;font-size:8px;font-weight:800;display:flex;position:relative}.wizard-steps>div:not(:last-child):after{content:"";background:#dce7e2;height:2px;position:absolute;bottom:-8px;left:34px;right:8px}.wizard-steps span{color:#70807b;background:#e6eeea;border-radius:50%;place-items:center;width:25px;height:25px;display:grid}.wizard-steps .active,.wizard-steps .done{color:#087e40}.wizard-steps .active span,.wizard-steps .done span{background:var(--green);color:#fff}.wizard-steps .done:not(:last-child):after{background:var(--green)}.wizard-card{min-height:500px}.wizard-card .title h3{font-size:20px}.wizard-choice-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:18px;display:grid}.wizard-choice-grid>button{text-align:left;border:1px solid var(--line);background:#fff;border-radius:12px;flex-direction:column;gap:5px;padding:15px;display:flex}.wizard-choice-grid>button.selected{background:#effbf4;border-color:#38ce77;box-shadow:0 0 0 1px #38ce7730}.wizard-choice-grid b{font-size:11px}.wizard-choice-grid span,.wizard-choice-grid small{color:var(--muted);font-size:8px}.wizard-field,.wizard-card>label{flex-direction:column;gap:7px;font-size:9px;font-weight:700;display:flex}.wizard-field input,.wizard-card select,.wizard-card input,.wizard-card textarea{border:1px solid var(--line);font:inherit;color:var(--ink);background:#fff;border-radius:8px;padding:10px}.wizard-field{max-width:420px}.wizard-card textarea{resize:vertical;min-height:90px}.wizard-actions{border-top:1px solid var(--line);justify-content:space-between;align-items:center;gap:10px;margin-top:22px;padding-top:16px;display:flex}.wizard-actions>button{border:1px solid var(--line);color:var(--ink);background:#fff;border-radius:8px;padding:10px 14px;font-size:9px;font-weight:800}.wizard-actions>button.primary{border-color:var(--green);background:var(--green);color:#fff}.wizard-actions>button:disabled{opacity:.45}.wizard-slots,.wizard-courts{margin-top:18px}.wizard-summary{background:#f0fbf4;border:1px solid #54d486;border-radius:12px;margin-bottom:17px;padding:14px}.wizard-summary>div:first-child{flex-direction:column;gap:5px;margin-bottom:9px;display:flex}.wizard-summary small{color:#078d43;letter-spacing:1px;font-size:7px;font-weight:900}.wizard-summary b{font-size:12px}.wizard-summary span{color:var(--muted);font-size:8px}.wizard-highlight{color:#fff;background:linear-gradient(115deg,#06343d,#078d4a);border-radius:13px;flex-direction:column;align-items:center;gap:6px;margin-top:17px;padding:24px;display:flex}.wizard-highlight small{color:var(--lime);letter-spacing:1px;font-size:7px;font-weight:900}.wizard-highlight b{font-size:24px}.wizard-highlight span{color:#cce2da;font-size:9px}.wizard-success{text-align:center;max-width:680px;margin:20px auto;padding:40px}.wizard-success>span{background:var(--green);color:#fff;border-radius:50%;place-items:center;width:62px;height:62px;margin:0 auto 14px;font-size:28px;display:grid}.wizard-success>small{letter-spacing:1.3px;color:#078d43;font-size:8px;font-weight:900}.wizard-success h2{margin:8px;font-size:24px}.wizard-success>p{color:var(--muted);font-size:10px;line-height:1.6}.wizard-success>em{color:#996807;background:#fff4d3;border-radius:7px;padding:9px;font-size:8px;font-style:normal;display:block}.wizard-recap{text-align:left;border:1px solid var(--line);background:#f7faf8;border-radius:10px;flex-direction:column;gap:6px;margin:18px 0;padding:14px;display:flex}.wizard-recap b{font-size:11px}.wizard-recap span{color:var(--muted);font-size:9px}.wizard-recap strong{font-size:17px}.booking-list-page{padding:18px}.booking-page-cards{flex-direction:column;gap:10px;display:flex}.booking-page-cards>article{border:1px solid var(--line);border-radius:12px;grid-template-columns:120px 1fr auto;align-items:center;gap:15px;padding:15px;display:grid}.booking-page-cards em{color:#53706a;background:#edf3f1;border-radius:5px;width:max-content;padding:5px 7px;font-size:7px;font-style:normal;font-weight:900}.booking-page-cards em.hosting{color:#078d43;background:#def8e7}.booking-page-cards em.joined{color:#3569a7;background:#e7f0ff}.booking-page-cards h3{margin:0 0 4px;font-size:12px}.booking-page-cards p,.booking-page-cards small{color:var(--muted);margin:3px 0;font-size:8px}.booking-page-cards>article>button,.page-back{background:var(--green);color:#fff;border:0;border-radius:8px;padding:9px 12px;font-size:8px;font-weight:800}.detail-page{flex-direction:column;gap:13px;display:flex}.page-back{color:#087e40;background:#fff;border:1px solid #43cf7a;align-self:flex-start}.court-detail-page>header{color:#fff;background:linear-gradient(115deg,#05323c,#078a4a);border-radius:14px;padding:22px}.court-detail-page>header small{color:var(--lime);letter-spacing:1px;font-size:8px;font-weight:900}.court-detail-page>header h2{margin:5px 0;font-size:22px}.court-detail-page>header p{color:#c9dfd7;margin:0;font-size:9px}.detail-status{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;padding:18px 0;display:flex}.detail-status>span{color:#078d43;text-transform:capitalize;background:#e5f9ec;border-radius:6px;padding:6px 9px;font-size:8px}.detail-status>span.awaiting_payment{color:#966608;background:#fff3ce}.detail-status>span.in_use{color:#ba4932;background:#ffede7}.detail-status b{font-size:13px}@media (width<=760px){.wizard-steps b{display:none}.wizard-choice-grid,.booking-page-cards>article{grid-template-columns:1fr}.booking-page-cards>article>button{justify-self:start}.wizard-card{min-height:0}}.duration-controls{margin-top:15px}.duration-controls label{flex-direction:column;gap:6px;display:flex}.duration-controls label>small{color:var(--muted);font-size:7px;font-weight:400}.selected-time-range{background:#ecfbf2;border:1px solid #45d080;border-radius:10px;align-items:center;gap:10px;margin:14px 0;padding:12px 14px;display:flex}.selected-time-range small{color:#078b42;letter-spacing:1px;font-size:7px;font-weight:900}.selected-time-range b{font-size:15px}.selected-time-range span{color:var(--muted);margin-left:auto;font-size:8px}.owner-wall{color:#fff;background-image:linear-gradient(90deg,#032c36f2,#009e4c47),repeating-linear-gradient(125deg,#07534d 0 38px,#087b62 39px 76px);background-position:50%;background-size:cover;border-radius:20px;justify-content:space-between;align-items:flex-end;gap:20px;min-height:210px;padding:30px 34px;display:flex;box-shadow:0 14px 34px #06343d18}.owner-wall small{letter-spacing:1.4px;color:var(--lime);font-size:8px;font-weight:900}.owner-wall h2{margin:7px 0 4px;font-size:28px}.owner-wall p{color:#d6e9e2;margin:0;font-size:10px}.wall-upload{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);cursor:pointer;background:#ffffff17;border:1px solid #fff6;border-radius:8px;align-items:center;gap:7px;padding:10px 13px;font-size:9px;font-weight:800;display:flex}.wall-upload input{display:none}.owner-dashboard-grid{grid-template-columns:1.05fr .95fr;align-items:start;gap:20px;display:grid}.section-row{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.text-action{color:#078a42;cursor:pointer;background:#effbf4;border:1px solid #49cf7c;border-radius:7px;padding:8px 10px;font-size:8px;font-weight:900}.upcoming-panel .owner-bookings{max-height:470px;padding-right:4px;overflow:auto}.owner-insights-grid{grid-template-columns:1fr 1.15fr .8fr;gap:20px;display:grid}.demographic-content{align-items:center;gap:23px;margin-top:12px;display:flex}.donut{border-radius:50%;flex:none;width:128px;height:128px;padding:18px}.donut>span{background:#fff;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;display:flex}.donut b{font-size:21px}.donut small{color:var(--muted);font-size:7px}.demo-legend{flex:1}.demo-legend p{grid-template-columns:9px 1fr auto;align-items:center;gap:7px;font-size:9px;display:grid}.demo-legend i{background:#dfeae5;border-radius:50%;width:8px;height:8px}.demo-legend i.returning{background:var(--green)}.demo-legend>small{color:var(--muted);font-size:7px}.hour-bars{flex-direction:column;gap:13px;margin-top:14px;display:flex}.hour-bars>div{grid-template-columns:84px 1fr;align-items:center;gap:12px;display:grid}.hour-bars span{flex-direction:column;display:flex}.hour-bars b{font-size:9px}.hour-bars small{color:var(--muted);font-size:7px}.hour-bars>div>i{background:#edf3f0;border-radius:8px;height:9px;overflow:hidden}.hour-bars em{background:linear-gradient(90deg,#00c853,#baf12b);border-radius:8px;height:100%;display:block}.booking-mix .mix-row{border-top:1px solid var(--line);justify-content:space-between;align-items:center;padding:17px 2px;font-size:9px;display:flex}.booking-mix .mix-row b{color:#078d43;font-size:17px}.owner-feature-page{text-align:center;background:radial-gradient(circle at 50% 0,#e5faed,#fff 48%);flex-direction:column;justify-content:center;align-items:center;min-height:520px;display:flex}.owner-feature-page>span{background:var(--green);color:#fff;border-radius:50%;place-items:center;width:66px;height:66px;font-size:28px;display:grid;box-shadow:0 12px 30px #00c85333}.owner-feature-page>small{letter-spacing:1.4px;color:#078d43;margin-top:17px;font-size:8px;font-weight:900}.owner-feature-page h2{margin:7px;font-size:25px}.owner-feature-page p{max-width:530px;color:var(--muted);font-size:10px;line-height:1.65}.owner-feature-page .primary{width:auto}@media (width<=1100px){.owner-dashboard-grid,.owner-insights-grid{grid-template-columns:1fr}.owner-insights-grid{grid-template-columns:repeat(2,1fr)}.booking-mix{grid-column:1/-1}}.wall-actions{align-items:center;gap:8px;display:flex}.wall-actions>button{background:var(--green);color:#fff;cursor:pointer;border:0;border-radius:8px;padding:10px 13px;font-size:9px;font-weight:900}.wall-actions>button:disabled{opacity:.55}.cover,.booking-page-head{background-position:50%;background-size:cover}.open-play-wall{align-items:flex-end;min-height:170px}.venue-thumb{text-shadow:0 1px 5px #000;background-position:50%!important;background-size:cover!important}.wizard-choice-grid>button{position:relative;overflow:hidden}.wizard-venue-photo{background-position:50%;background-size:cover;height:78px;margin:-15px -15px 7px;display:block}.wizard-choice-grid>button.selected .wizard-venue-photo{margin:-14px -14px 7px}@media (width<=600px){.wall-actions{flex-direction:column;align-items:stretch}.wall-actions>button,.wall-upload{justify-content:center;width:100%}}@media (width<=700px){.owner-wall{flex-direction:column;align-items:flex-start;min-height:240px}.owner-insights-grid{grid-template-columns:1fr}.booking-mix{grid-column:auto}.demographic-content{align-items:flex-start}.section-row{flex-direction:column}}.has-photo{color:#0000!important;background-position:50%!important;background-size:cover!important}.profile-photo-actions{justify-content:center;gap:8px;margin-top:20px;display:flex}.profile-photo-actions label,.profile-photo-actions button{border:1px solid var(--green);color:var(--green);cursor:pointer;background:#fff;border-radius:8px;padding:9px 13px;font-size:9px;font-weight:900}.profile-photo-actions label input{display:none}.profile-photo-actions button{background:var(--green);color:#fff}.profile-photo-message{margin-top:10px;color:#078d43!important;display:block!important}.fair-rounds{flex-direction:column;gap:14px;display:flex}.fair-round{border:1px solid var(--line);background:#fbfdfc;border-radius:12px;padding:12px}.round-title{justify-content:space-between;align-items:center;margin-bottom:10px;display:flex}.round-title b{font-size:11px}.round-title span{color:#078d43;font-size:8px}.rotation-rest{color:#8a680e;background:#fff8df;border-radius:7px;margin:9px 0 0;padding:8px;font-size:8px}.regenerate-matches{color:#078d43;cursor:pointer;background:#effbf4;border:1px solid #42ce79;border-radius:8px;margin:4px 0 12px;padding:8px 11px;font-size:8px;font-weight:900}.fair-round .suggested-matches{grid-template-columns:repeat(2,1fr)}@media (width<=700px){.profile-photo-actions{flex-direction:column}.fair-round .suggested-matches{grid-template-columns:1fr}}.owner-block-flow{flex-direction:column;gap:12px;display:flex}.owner-block-flow>label{flex-direction:column;gap:6px;font-size:9px;font-weight:800;display:flex}.owner-block-flow input,.owner-block-flow select{border:1px solid var(--line);font:inherit;color:var(--ink);background:#fff;border-radius:8px;padding:11px}.owner-time-summary{background:#effbf4;border:1px solid #48d181;border-radius:10px;align-items:center;gap:12px;padding:12px;display:flex}.owner-time-summary small{letter-spacing:1px;color:#078d43;font-size:7px;font-weight:900}.owner-time-summary b{font-size:14px}.owner-time-summary span{color:var(--muted);margin-left:auto;font-size:8px}.owner-block-flow>h3{margin:5px 0 0;font-size:12px}.owner-court-picker{grid-template-columns:repeat(2,1fr);gap:8px;display:grid}.owner-court-picker button{text-align:left;border:1px solid var(--line);background:#fff;border-radius:10px;justify-content:space-between;align-items:center;gap:10px;min-height:70px;padding:12px;display:flex}.owner-court-picker button>span{flex-direction:column;gap:4px;display:flex}.owner-court-picker b{font-size:10px}.owner-court-picker small,.owner-court-picker em{color:var(--muted);font-size:7px;font-style:normal}.owner-court-picker strong{color:#0ba84c;font-size:8px}.owner-court-picker .selected{background:#eafaf0;border-color:#20c968}.owner-court-picker .occupied{background:#fff1ed;border-color:#f2b4a5}.owner-court-picker .occupied b,.owner-court-picker .occupied strong{color:#bd4e36}.owner-court-picker button:disabled{opacity:1;cursor:not-allowed}.owner-block-flow>.primary{margin:0}.owner-block-flow>.primary:disabled{opacity:.45}@media (width<=600px){.owner-court-picker{grid-template-columns:1fr}.owner-time-summary{flex-direction:column;align-items:flex-start}.owner-time-summary span{margin-left:0}}.dashboard-recruitment{overflow:hidden}.recruitment-card-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;display:grid}.recruitment-card-grid>article{border:1px solid var(--line);background:#fff;border-radius:14px;overflow:hidden}.recruitment-photo{color:#fff;background-color:#0000;background-image:linear-gradient(90deg,#05333dcc,#0ba25a55),repeating-linear-gradient(125deg,#07534d 0 35px,#087b62 36px 70px);background-position:50%;background-repeat:repeat,repeat;background-size:cover;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box;align-items:flex-end;height:145px;padding:14px;display:flex}.recruitment-photo span{text-shadow:0 2px 8px #000;font-size:11px;font-weight:900}.recruitment-copy{padding:13px}.recruitment-copy small{color:#078d43;text-transform:uppercase;font-size:7px;font-weight:900}.recruitment-copy h3{margin:5px 0;font-size:12px;line-height:1.35}.recruitment-copy p{color:var(--muted);margin:5px 0;font-size:8px;line-height:1.45}.recruitment-copy button{background:var(--green);color:#fff;border:0;border-radius:8px;width:100%;margin-top:7px;padding:9px;font-size:8px;font-weight:900}.recruitment-copy button:disabled{background:#c9d7d2}.invite-search-wrap{margin:12px 0;position:relative}.invite-row input{border:1px solid var(--line);background:#fff;border-radius:7px;padding:9px;font-size:9px}.invite-search-results{z-index:6;border:1px solid var(--line);background:#fff;border-radius:10px;padding:6px;position:absolute;top:40px;left:0;right:120px;box-shadow:0 12px 30px #183e3525}.invite-search-results>button{text-align:left;background:#fff;border:0;border-radius:7px;grid-template-columns:32px 1fr auto;align-items:center;gap:8px;width:100%;padding:7px;display:grid}.invite-search-results>button:hover,.invite-search-results>button.chosen{background:#edfbf2}.invite-search-results span{flex-direction:column;display:flex}.invite-search-results b{font-size:9px}.invite-search-results small{color:var(--muted);font-size:7px}.invite-search-results i{color:#08a64a}.invite-search-results p{color:var(--muted);margin:0;padding:8px;font-size:8px}.tap-booking-shell{grid-template-columns:minmax(0,1fr) 380px;align-items:start;gap:20px;display:grid}.tap-booking-main{border:1px solid var(--line);background:#fff;border-radius:17px;min-width:0;padding:20px}.tap-booking-cover{height:165px}.tap-venue-select{flex-direction:column;gap:6px;margin:14px 0;font-size:8px;font-weight:900;display:flex}.tap-venue-select select{border:1px solid var(--line);background:#fff;border-radius:8px;padding:10px}.tap-date-strip{gap:9px;padding:3px 0 13px;display:flex;overflow:auto}.tap-date-strip button{border:1px solid var(--line);background:#fff;border-radius:13px;flex-direction:column;align-items:center;min-width:92px;padding:10px;display:flex}.tap-date-strip button.active{color:#087f40;background:#eafaf0;border-color:#20c968}.tap-date-strip small{font-size:8px}.tap-date-strip b{font-size:18px}.tap-date-strip span{color:var(--muted);font-size:8px}.slot-legend{flex-wrap:wrap;gap:15px;margin:5px 0 13px;display:flex}.slot-legend span{color:var(--muted);align-items:center;gap:5px;font-size:8px;display:flex}.slot-legend i{background:#edf9f0;border:1px solid #78d69a;border-radius:3px;width:10px;height:10px}.slot-legend i.picked{background:var(--green);border-color:var(--green)}.slot-legend i.booked{background:#fff0eb;border-color:#f0a38d}.slot-legend i.blocked{background:#edf0ef;border-color:#cbd4d1}.tap-grid-scroll{overflow:auto}.tap-slot-grid{gap:7px;min-width:680px;display:grid}.tap-grid-head{text-align:center;color:#2d4944;padding:9px;font-size:9px;font-weight:900}.tap-grid-head.time{text-align:left}.tap-time{white-space:nowrap;align-items:center;gap:7px;padding:9px;font-size:9px;display:flex}.tap-cell{color:#087f40;background:#f1fbf4;border:1px solid #83dba3;border-radius:9px;flex-direction:column;justify-content:center;align-items:center;min-height:58px;font-size:8px;display:flex}.tap-cell span{margin-top:3px;font-size:8px}.tap-cell.picked{border-color:var(--green);color:#fff;background:linear-gradient(135deg,#00c853,#8dde20);box-shadow:0 5px 14px #00c85322}.tap-cell.booked{color:#c4583f;background:#fff0eb;border-color:#f1b7a7}.tap-cell:disabled{cursor:not-allowed}.tap-cart{position:sticky;top:20px}.tap-cart .section-row>button{color:#079a49;background:0 0;border:0;font-size:8px;font-weight:900}.tap-cart-items{max-height:400px;overflow:auto}.tap-cart-items article{border-bottom:1px solid var(--line);grid-template-columns:24px 1fr auto 20px;align-items:center;gap:8px;padding:10px 0;display:grid}.tap-cart-items article>span{color:#08a64a;background:#e1f8e9;border-radius:50%;place-items:center;width:22px;height:22px;font-size:9px;display:grid}.tap-cart-items article>div{flex-direction:column;display:flex}.tap-cart-items b{font-size:9px}.tap-cart-items small{color:var(--muted);margin-top:3px;font-size:7px}.tap-cart-items strong{font-size:10px}.tap-cart-items article>button{color:#78908a;background:0 0;border:0;font-size:17px}.tap-cart>.primary{margin-right:0}.tap-cart .cash-reserved{margin-bottom:12px}@media (width<=1100px){.tap-booking-shell{grid-template-columns:1fr}.tap-cart{position:static}.recruitment-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=650px){.recruitment-card-grid{grid-template-columns:1fr}.invite-search-results{right:0}.tap-booking-main{padding:14px}.tap-booking-cover{height:145px}.tap-cart{padding:15px}}.recruitment-card-grid>article{transition:transform .16s,box-shadow .16s;box-shadow:0 7px 22px #173c330c}.recruitment-card-grid>article:hover{transform:translateY(-2px);box-shadow:0 11px 28px #173c3314}.recruitment-photo{background-image:linear-gradient(145deg,#075b50,#24b96b);justify-content:space-between;gap:10px}.recruitment-photo strong{color:#fff;background:#032c36c7;border-radius:20px;padding:6px 9px;font-size:11px;box-shadow:0 2px 8px #0003}.mobile-menu-toggle,.mobile-menu-backdrop{display:none}@media (width<=900px){.content>header{gap:8px}.mobile-menu-toggle{border:1px solid var(--line);width:40px;height:40px;color:var(--navy);cursor:pointer;background:#fff;border-radius:10px;flex:0 0 40px;place-items:center;margin-left:3px;font-size:20px;font-weight:900;display:grid}.mobile-menu-backdrop{z-index:60;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#032c3666;align-items:flex-end;display:flex;position:fixed;inset:0}.mobile-menu-sheet{width:100%;max-height:min(82vh,720px);padding:18px 16px calc(18px + env(safe-area-inset-bottom));background:#fff;border-radius:22px 22px 0 0;overflow:auto;box-shadow:0 -18px 50px #032c3633}.mobile-menu-head{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:12px;padding:2px 4px 15px;display:flex}.mobile-menu-head>div{flex-direction:column;gap:3px;display:flex}.mobile-menu-head b{font-size:14px}.mobile-menu-head small{color:var(--muted);font-size:9px}.mobile-menu-head>button{width:36px;height:36px;color:var(--navy);background:#eef5f2;border:0;border-radius:50%;font-size:22px}.mobile-menu-links{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:14px 0;display:grid}.mobile-menu-links>button{border:1px solid var(--line);min-height:50px;color:var(--ink);text-align:left;background:#f8fbf9;border-radius:11px;align-items:center;gap:10px;padding:10px 12px;font-size:10px;font-weight:800;display:flex}.mobile-menu-links>button i{color:#079a49;background:#e5f8ec;border-radius:8px;flex:0 0 27px;place-items:center;height:27px;font-size:14px;font-style:normal;display:grid}.mobile-menu-links>button.active{color:#078b43;background:#ecfbf2;border-color:#34ce75}.mobile-signout{color:#bd4d36;background:#fff2ee;border:1px solid #f0b4a4;border-radius:11px;width:100%;padding:13px;font-size:10px;font-weight:900}}@media (width<=420px){.mobile-menu-links{grid-template-columns:1fr}}.my-open-play-head{color:#fff;background:linear-gradient(112deg,#06343d,#078d4a)}.my-open-play-head p{color:#d4e8e0}.my-open-empty{text-align:center;padding:46px 22px}.my-open-empty>span{color:#08a64a;background:#e6faed;border-radius:50%;place-items:center;width:62px;height:62px;margin:0 auto 13px;font-size:27px;display:grid}.my-open-empty h3{font-size:16px}.my-open-empty p{color:var(--muted);font-size:9px}.my-open-empty .primary{width:auto}.hosted-session-cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;display:grid}.hosted-session-cards>button{text-align:left;border:1px solid var(--line);color:var(--ink);background:#f8fbf9;border-radius:11px;flex-direction:column;gap:5px;padding:13px;display:flex}.hosted-session-cards>button.active{background:#ecfbf2;border-color:#36cf76;box-shadow:0 0 0 1px #36cf7633}.hosted-session-cards b{font-size:10px;line-height:1.35}.hosted-session-cards span,.hosted-session-cards small{color:var(--muted);font-size:8px}.hosted-session-cards>button.active small{color:#078d43}.my-open-board{overflow:hidden}@media (width<=850px){.hosted-session-cards{display:flex;overflow:auto}.hosted-session-cards>button{min-width:240px}.my-open-play-head{flex-direction:column;align-items:flex-start;gap:15px}}.owner-open-control-head{color:#fff;background:linear-gradient(112deg,#06343d,#0b9e56)}.owner-open-control-head p{color:#d5e9e1}.owner-open-control-head>button{color:#087e41;background:#fff}.owner-open-kpis article:nth-child(2){background:#effbf4;border-color:#57d487}.owner-open-kpis article:nth-child(3){background:#f7faf9;border-color:#b8d4ca}.owner-only-note{color:#078d43;background:#e6f9ed;border-radius:20px;padding:7px 10px;font-size:8px;font-weight:900}.hosted-session-cards em{color:#61766f;background:#edf3f1;border-radius:5px;width:max-content;padding:4px 6px;font-size:7px;font-style:normal;font-weight:900}.hosted-session-cards em.owner-hosted{color:#078d43;background:#dcf8e6}.owner-open-board{overflow:hidden}@media (width<=700px){.owner-open-control-head{flex-direction:column;align-items:flex-start;gap:14px}.owner-open-control-head>button{width:100%}.owner-only-note{align-self:flex-start}}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}.tap-cell.blocked{color:#71817d;background:#edf0ef;border-color:#d2dbd8}.open-discovery-tools{border:1px solid var(--line);background:#fff;border-radius:17px;padding:18px;box-shadow:0 6px 25px #254b4008}.open-search{border:1px solid var(--line);border-radius:11px;align-items:center;gap:10px;max-width:570px;height:48px;padding:0 14px;display:flex}.open-search span{color:#55716b;font-size:25px}.open-search input{width:100%;color:var(--ink);background:0 0;border:0;outline:0;font-size:12px}.open-date-cards{gap:9px;padding:16px 1px 5px;display:flex;overflow-x:auto}.open-date-cards button{border:1px solid var(--line);min-width:92px;min-height:91px;color:var(--ink);cursor:pointer;background:#fff;border-radius:13px;flex-direction:column;justify-content:center;align-items:center;transition:all .15s;display:flex}.open-date-cards button:hover{border-color:#64d691;transform:translateY(-1px)}.open-date-cards button.active{color:#fff;background:linear-gradient(145deg,#00c853,#82d81d);border-color:#00b94d;box-shadow:0 8px 20px #00b94d25}.open-date-cards small{font-size:7px;font-weight:900}.open-date-cards b{margin:3px 0;font-size:20px}.open-date-cards span{font-size:7px}.open-date-cards em{color:#0aaa4c;margin-top:4px;font-size:8px;font-style:normal}.open-date-cards .active em{color:#fff}.open-filter-chips{flex-wrap:wrap;gap:7px;padding-top:13px;display:flex}.open-filter-chips button{border:1px solid var(--line);color:#35504b;cursor:pointer;background:#fff;border-radius:20px;padding:8px 13px;font-size:8px;font-weight:800}.open-filter-chips button.active{color:#078d43;background:#eafaf0;border-color:#0ac75a}.open-results-title>button{color:#078d43;cursor:pointer;background:0 0;border:0;font-size:8px;font-weight:900}.open-card-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;display:grid}.open-discovery-card{border:1px solid var(--line);background:#fff;border-radius:16px;transition:transform .16s,box-shadow .16s;overflow:hidden;box-shadow:0 9px 28px #173c3311}.open-discovery-card:hover{transform:translateY(-2px);box-shadow:0 13px 32px #173c3318}.open-card-photo{color:#fff;background-position:50%;background-size:cover;align-items:flex-start;min-height:172px;padding:16px;display:flex;position:relative}.open-card-photo:after{content:"";background:linear-gradient(#0226221f 0%,#02262214 36%,#022622d6 100%);position:absolute;inset:0}.open-card-badges{z-index:1;gap:6px;display:flex;position:relative}.open-card-badges span{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);text-transform:uppercase;background:#032c36b8;border:1px solid #a8e9c1;border-radius:18px;padding:6px 9px;font-size:7px;font-weight:900}.open-card-photo>strong{z-index:1;text-shadow:0 2px 8px #0006;background:#032c36c7;border-radius:20px;margin-left:auto;padding:6px 10px;font-size:17px;position:relative}.open-card-photo h3{z-index:1;text-shadow:0 2px 8px #0008;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:0;font-size:16px;line-height:1.18;display:-webkit-box;position:absolute;bottom:15px;left:16px;right:16px;overflow:hidden}.open-card-details{border-bottom:1px solid var(--line);min-height:145px;padding:15px 17px}.open-card-details p{align-items:center;gap:7px;margin:0 0 12px;font-size:9px;display:flex}.open-card-details p span{color:#079b49;font-size:13px}.open-card-details p em{color:#a1afab;font-style:normal}.open-card-details small{color:var(--muted);margin:-8px 0 11px;padding-left:23px;font-size:8px;line-height:1.45;display:block}.open-card-footer{grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:13px 15px;display:grid}.open-player-stack{align-items:center;display:flex}.open-player-stack>span{border:2px solid #fff;width:30px;height:30px;margin-right:-8px;font-size:7px}.open-player-stack i{color:#536a65;background:#edf2f0;border-radius:50%;place-items:center;width:30px;height:30px;font-size:8px;font-style:normal;font-weight:900;display:grid}.open-joined{flex-direction:column;padding-left:4px;display:flex}.open-joined b{font-size:11px}.open-joined small{color:var(--muted);font-size:7px}.open-card-footer>button{background:var(--green);color:#fff;white-space:nowrap;cursor:pointer;border:0;border-radius:8px;padding:10px 12px;font-size:8px;font-weight:900}.open-card-footer>button:disabled{background:#c9d7d2}.open-card-footer>button.leave-play{color:#b65039;background:#fff0eb}@media (width<=1100px){.open-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=700px){.open-search{max-width:none}.open-card-grid{grid-template-columns:1fr}.open-card-photo{min-height:185px}.open-date-cards button{min-width:78px}.open-card-footer{grid-template-columns:auto 1fr}.open-card-footer>button{grid-column:1/-1;width:100%}}.host-tap-schedule{border:1px solid var(--line);background:#f9fcfa;border-radius:15px;margin-bottom:20px;padding:15px}.host-tap-schedule .tap-booking-cover{height:150px}.host-tap-schedule .tap-slot-grid{border:1px solid var(--line);background:#fff;border-radius:12px;padding:10px}.host-tap-schedule .tap-cell{cursor:pointer}.host-tap-schedule .tap-cell.picked{color:#fff;background:linear-gradient(135deg,#00c853,#8dde20)}.host-selected-range{background:#ecfbf2;border:1px solid #45d080;border-radius:11px;justify-content:space-between;align-items:center;gap:15px;margin-top:13px;padding:13px 15px;display:flex}.host-selected-range>div{flex-direction:column;gap:4px;display:flex}.host-selected-range small{letter-spacing:1px;color:#078b42;font-size:7px;font-weight:900}.host-selected-range b{font-size:14px}.host-selected-range>span{color:#54706a;font-size:9px}.host-tap-schedule>.field-help{color:var(--muted);margin:9px 2px 0;font-size:8px;display:block}@media (width<=650px){.host-tap-schedule{padding:10px}.host-selected-range{flex-direction:column;align-items:flex-start}.host-tap-schedule .tap-booking-cover{height:135px}}.owner-host-create-page .host-create-form{margin-top:16px}.owner-host-create-page .tap-venue-select select:disabled{opacity:1;color:var(--ink);background:#f3f7f5}.owner-host-success{color:#087f40;background:#ecfbf2;border:1px solid #45d080;border-radius:10px;flex-direction:column;gap:4px;margin:12px 0;padding:12px 14px;display:flex}.owner-host-success b{font-size:10px}.owner-host-success span{color:var(--muted);font-size:8px}


/* ===== PICKLE MANIA MILESTONE 4R CHECKOUT ===== */
.checkout-shell{max-width:780px;margin:0 auto;display:flex;flex-direction:column;gap:12px}
.checkout-back{align-self:flex-start;border:0;background:transparent;color:#078d43;font-size:9px;font-weight:900;cursor:pointer;padding:5px 0}
.checkout-back:disabled{color:#6d847e;cursor:default}
.checkout-card{padding:22px}
.checkout-venue{background:#f0fbf4;border:1px solid #53d487;border-radius:11px;display:flex;flex-direction:column;gap:4px;padding:13px;margin:15px 0}
.checkout-venue b{font-size:12px}.checkout-venue span{font-size:8px;color:var(--muted)}
.checkout-items{display:flex;flex-direction:column;margin-bottom:15px}
.checkout-items article,.success-booking-items article{display:flex;justify-content:space-between;align-items:center;gap:15px;border-bottom:1px solid var(--line);padding:12px 2px}
.checkout-items article>div,.success-booking-items article>div{display:flex;flex-direction:column;gap:4px}
.checkout-items b,.success-booking-items b{font-size:10px}.checkout-items small,.success-booking-items small{font-size:8px;color:var(--muted)}
.checkout-items strong,.success-booking-items strong{font-size:11px}
.checkout-field{display:flex;flex-direction:column;gap:6px;font-size:9px;font-weight:800;margin:13px 0}
.checkout-field select,.checkout-field input{border:1px solid var(--line);border-radius:9px;padding:11px;background:#fff;color:var(--ink);font:inherit}
.checkout-payment-choice{display:flex;flex-direction:column;gap:7px;margin:18px 0}
.checkout-payment-choice>button{border:1px solid var(--line);background:#fff;border-radius:10px;padding:12px;text-align:left;display:flex;justify-content:space-between;align-items:center;gap:12px}
.checkout-payment-choice>button span{display:flex;flex-direction:column;gap:3px}
.checkout-payment-choice>button b{font-size:10px}.checkout-payment-choice>button small{font-size:8px;color:var(--muted)}
.checkout-payment-choice>button i{font-style:normal;color:#08a64a;font-size:15px}
.checkout-payment-choice>button.active{background:#ecfbf2;border-color:#35ce76}
.checkout-payment-choice>button:disabled{opacity:.48}
.checkout-terms{background:#f7faf8;border:1px solid var(--line);border-radius:11px;padding:14px;margin:18px 0}
.checkout-terms>b{font-size:10px}.checkout-terms p{font-size:8px;line-height:1.55;color:var(--muted)}
.checkout-terms label{display:flex;align-items:flex-start;gap:9px;margin-top:9px;font-size:8px;line-height:1.5}
.checkout-terms input{margin-top:1px}
.checkout-main-button{width:100%;margin-top:8px}
.payment-timer{text-align:center;background:#fff8df;border:1px solid #ebc95d;border-radius:12px;padding:16px;margin:15px 0;display:flex;flex-direction:column;gap:4px}
.payment-timer small{font-size:7px;font-weight:900;color:#8b6608;letter-spacing:1px}
.payment-timer b{font-size:28px;color:#173f39}.payment-timer span{font-size:8px;color:var(--muted)}
.payment-total-box{text-align:center;background:linear-gradient(115deg,#05323c,#078a4a);color:#fff;border-radius:13px;padding:18px;margin-bottom:16px;display:flex;flex-direction:column}
.payment-total-box small{color:#cce2da;font-size:7px;letter-spacing:1px;font-weight:900}.payment-total-box strong{font-size:28px;margin-top:4px}
.payment-destination{border:1px solid var(--line);border-radius:12px;padding:16px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:5px}
.payment-destination>small{color:#078d43;font-size:8px;font-weight:900;text-transform:uppercase;letter-spacing:1px}
.payment-destination>b{font-size:13px}.payment-destination>span{font-size:9px;color:var(--muted)}.payment-destination>strong{font-size:13px}
.checkout-qr{width:min(230px,80%);aspect-ratio:1;object-fit:contain;border:1px solid var(--line);border-radius:12px;margin-top:11px;padding:8px;background:#fff}
.receipt-uploader{margin-top:18px}.receipt-uploader>b{font-size:11px}
.receipt-drop{margin-top:9px;border:2px dashed #8bd5a5;background:#f3fcf6;border-radius:12px;min-height:150px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;cursor:pointer}
.receipt-drop>span{font-size:27px;color:#08a64a}.receipt-drop>b{font-size:10px}.receipt-drop>small{font-size:7px;color:var(--muted)}
.receipt-drop input,.change-image input{display:none}
.receipt-preview{width:100%;max-height:420px;object-fit:contain;background:#f4f7f5;border:1px solid var(--line);border-radius:12px;margin-top:10px}
.change-image{display:block;width:max-content;margin:9px auto 0;border:1px solid #33ca70;border-radius:8px;padding:8px 12px;color:#078d43;font-size:8px;font-weight:900;cursor:pointer}
.booking-success-4r{text-align:center;padding:38px 28px}
.success-check{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:var(--green);color:#fff;font-size:30px;margin:0 auto 14px}
.booking-success-4r>small{color:#078d43;font-size:8px;letter-spacing:1.3px;font-weight:900}.booking-success-4r h2{font-size:23px;margin:8px}.booking-success-4r>p{font-size:9px;color:var(--muted);line-height:1.5}
.success-booking-items{text-align:left;margin:18px 0}
.success-status{background:#fff4d3;border-radius:10px;padding:13px;display:flex;flex-direction:column;gap:4px;margin:14px 0}
.success-status small{font-size:7px;color:#94690e;font-weight:900}.success-status b{font-size:10px;color:#74550e}
@media(max-width:650px){.checkout-card{padding:16px}.payment-total-box strong{font-size:24px}.booking-success-4r{padding:28px 17px}}


/* ===== 4R FLOATING BOOKING LIST ===== */

.tap-booking-shell{
    display:block !important;
}

.tap-cart{
    display:none !important;
}

.booking-float{
    position:fixed;
    left:50%;
    bottom:18px;
    transform:translateX(-50%);
    width:min(560px,calc(100% - 24px));
    z-index:1000;

    background:rgba(255,255,255,.98);
    border:1px solid #c9ded2;
    border-radius:18px;
    box-shadow:0 16px 45px rgba(5,50,60,.20);
    backdrop-filter:blur(14px);

    padding:12px 14px;
    animation:bookingFloatIn .2s ease-out;
}

.booking-float-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding-bottom:9px;
    border-bottom:1px solid #e4ece7;
}

.booking-float-summary{
    display:flex;
    flex-direction:column;
    gap:3px;
}

.booking-float-summary b{
    font-size:11px;
}

.booking-float-summary strong{
    font-size:10px;
    color:#078d43;
}

.booking-float-checkout{
    border:0;
    border-radius:11px;
    padding:10px 14px;
    background:#00c853;
    color:#fff;
    font-size:10px;
    font-weight:900;
    white-space:nowrap;
    cursor:pointer;
}

.booking-float-items{
    display:flex;
    flex-direction:column;
    max-height:190px;
    overflow:auto;
}

.booking-float-item{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;
    padding:8px 2px;
    border-bottom:1px solid #edf2ef;
}

.booking-float-item:last-child{
    border-bottom:0;
}

.booking-float-item span{
    font-size:10px;
    font-weight:700;
}

.booking-float-item strong{
    font-size:10px;
}

@keyframes bookingFloatIn{
    from{
        opacity:0;
        transform:translate(-50%,16px) scale(.98);
    }
    to{
        opacity:1;
        transform:translate(-50%,0) scale(1);
    }
}

@media(max-width:550px){
    .booking-float{
        bottom:10px;
        width:calc(100% - 18px);
        padding:11px 12px;
        border-radius:15px;
    }

    .booking-float-checkout{
        padding:9px 12px;
    }
}

/* ===== 4R PAYMENT SETTINGS LAYOUT CLEANUP ===== */

.payment-settings-grid{
    align-items:start !important;
    grid-auto-rows:auto !important;
}

.payment-setting-card{
    height:auto !important;
    min-height:0 !important;
}

.payment-setting-card>small{
    display:block;
    margin-top:14px;
}

/* Disabled payment methods remain visible but clearly inactive */
.payment-setting-card:has(input:disabled){
    opacity:.72;
}


/* =========================================================
   4R PAYMENT METHODS - STRONG FORM FIELD OVERRIDE
   ========================================================= */

.payment-settings-page .payment-setting-card{
    background:#ffffff !important;
    border:1px solid #d5e1dc !important;
    border-radius:18px !important;
    padding:26px 28px !important;
    box-shadow:0 8px 26px rgba(5,50,60,.08) !important;
}

/* Labels */
.payment-settings-page .payment-setting-card > label{
    display:flex !important;
    flex-direction:column !important;
    gap:7px !important;
    margin-top:16px !important;
    font-size:9px !important;
    font-weight:900 !important;
    color:#072f39 !important;
}

/* TEXT INPUT BOXES */
.payment-settings-page .payment-setting-card label input:not([type="checkbox"]):not([type="file"]){
    display:block !important;
    width:100% !important;
    min-height:42px !important;

    box-sizing:border-box !important;

    margin-top:3px !important;
    padding:10px 12px !important;

    background:#ffffff !important;

    border:1.5px solid #b8cac3 !important;
    border-radius:8px !important;

    color:#082f39 !important;
    font-size:10px !important;
    font-weight:700 !important;

    outline:none !important;

    box-shadow:
        inset 0 1px 2px rgba(5,50,60,.03),
        0 1px 3px rgba(5,50,60,.05) !important;
}

.payment-settings-page .payment-setting-card label input:not([type="checkbox"]):not([type="file"]):hover{
    border-color:#7baa96 !important;
}

.payment-settings-page .payment-setting-card label input:not([type="checkbox"]):not([type="file"]):focus{
    border-color:#00b957 !important;

    box-shadow:
        0 0 0 3px rgba(0,185,87,.12),
        inset 0 1px 2px rgba(5,50,60,.03) !important;
}

/* QR UPLOAD FIELD */
.payment-settings-page .qr-upload{
    display:flex !important;
    flex-direction:column !important;
    gap:8px !important;
}

.payment-settings-page .qr-upload input[type="file"]{
    display:block !important;
    width:100% !important;
    box-sizing:border-box !important;

    padding:18px !important;
    margin-top:3px !important;

    background:#f8fcfa !important;

    border:2px dashed #a9c9b7 !important;
    border-radius:10px !important;

    color:#617a72 !important;
    cursor:pointer !important;
}

/* Existing uploaded QR preview */
.payment-settings-page .qr-upload img{
    display:block !important;

    width:170px !important;
    height:170px !important;

    object-fit:contain !important;

    margin:10px auto 0 !important;
    padding:8px !important;

    background:#fff !important;
    border:1px solid #cbdad3 !important;
    border-radius:12px !important;

    box-shadow:0 5px 16px rgba(5,50,60,.08) !important;
}

/* Payment method title */
.payment-settings-page .payment-setting-card h3,
.payment-settings-page .payment-setting-card h4{
    margin-bottom:12px !important;
}

/* Grid spacing */
.payment-settings-page .payment-settings-grid{
    gap:20px !important;
    align-items:start !important;
}

@media(max-width:700px){
    .payment-settings-page .payment-setting-card{
        padding:20px !important;
    }
}


/* =========================================================
   4R OWNER PROFILE / VENUE SETUP
   ========================================================= */

.owner-venue-head{
    margin-top:28px;
    padding:18px 20px;
    border:1px solid #cfe0d7;
    border-radius:16px;
    background:#f7fcf9;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
}

.owner-venue-head small{
    font-size:8px;
    font-weight:900;
    letter-spacing:1.2px;
    color:#078d43;
}

.owner-venue-head h3{
    margin:4px 0 2px;
    font-size:18px;
}

.owner-venue-head p{
    margin:0;
    font-size:9px;
    color:var(--muted);
}

.venue-live-control,
.court-live-control{
    display:flex;
    align-items:center;
    gap:10px;
}

.venue-status{
    padding:6px 9px;
    border-radius:999px;
    font-size:8px;
    font-weight:900;
    letter-spacing:.7px;
    white-space:nowrap;
}

.venue-status.live{
    background:#dff8e9;
    color:#078c43;
}

.venue-status.coming{
    background:#fff1c9;
    color:#916509;
}

.venue-live-switch,
.court-live-switch{
    width:46px;
    height:25px;
    border:0;
    border-radius:999px;
    padding:3px;
    background:#b9c6c0;
    cursor:pointer;
    transition:.18s ease;
}

.venue-live-switch i,
.court-live-switch i{
    display:block;
    width:19px;
    height:19px;
    border-radius:50%;
    background:#fff;
    box-shadow:0 2px 5px rgba(0,0,0,.16);
    transition:.18s ease;
}

.venue-live-switch.on,
.court-live-switch.on{
    background:#00bd58;
}

.venue-live-switch.on i,
.court-live-switch.on i{
    transform:translateX(21px);
}

.owner-profile-settings{
    margin-top:20px;
    padding-top:20px;
    border-top:1px solid var(--line);
}

.owner-profile-fields{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
    margin-top:14px;
}

.owner-profile-fields label{
    display:flex;
    flex-direction:column;
    gap:7px;
    font-size:9px;
    font-weight:900;
}

.owner-profile-fields input,
.owner-profile-fields select{
    width:100%;
    box-sizing:border-box;
    min-height:42px;
    padding:10px 12px;
    background:#fff;
    border:1.5px solid #b8cac3;
    border-radius:9px;
    color:var(--ink);
    outline:none;
}

.owner-profile-fields input:focus,
.owner-profile-fields select:focus{
    border-color:#00b957;
    box-shadow:0 0 0 3px rgba(0,185,87,.10);
}

.owner-profile-days{
    border:0;
    padding:0;
    margin:17px 0 0;
}

.owner-profile-days legend{
    margin-bottom:8px;
    font-size:9px;
    font-weight:900;
}

.owner-save-setup{
    margin-top:16px;
}

.owner-courts-config{
    margin-top:26px;
    padding-top:22px;
    border-top:1px solid var(--line);
}

.add-court-button{
    border:1px solid #17b95a;
    border-radius:9px;
    background:#fff;
    color:#078d43;
    padding:8px 12px;
    font-size:8px;
    font-weight:900;
    cursor:pointer;
}

.owner-court-list{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
    margin-top:15px;
}

.owner-court-list article{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:13px 14px;
    border:1px solid #d5e2dc;
    border-radius:12px;
    background:#fff;
}

.owner-court-list article>div:first-child{
    display:flex;
    flex-direction:column;
    gap:3px;
}

.owner-court-list article b{
    font-size:10px;
}

.owner-court-list article small{
    font-size:7px;
    color:var(--muted);
}

.court-live-control span{
    font-size:8px;
    font-weight:900;
    color:#56716a;
}

.add-court-wide{
    width:100%;
    margin-top:12px;
    padding:12px;
    border:1.5px dashed #79c99a;
    border-radius:10px;
    background:#f5fcf7;
    color:#078d43;
    font-size:9px;
    font-weight:900;
    cursor:pointer;
}

@media(max-width:700px){
    .owner-venue-head{
        align-items:flex-start;
        flex-direction:column;
    }

    .owner-profile-fields,
    .owner-court-list{
        grid-template-columns:1fr;
    }
}

/* =========================================================
   4R REGULAR PLAYER DESKTOP NAVIGATION
   ========================================================= */

@media(min-width:901px){

    /* Player only: remove left rail */
    .player-shell{
        display:block !important;
    }

    .player-shell > .rail{
        display:none !important;
    }

    .player-shell > .content{
        width:100% !important;
        max-width:none !important;
        margin:0 !important;
        padding:0 38px 40px !important;
    }

    /* Top navigation */
    .player-topnav{
        position:sticky;
        top:0;
        z-index:900;

        width:calc(100% + 76px);
        margin-left:-38px;
        margin-bottom:28px;
        padding:0 36px;

        min-height:78px;

        display:flex;
        align-items:center;
        gap:7px;

        background:rgba(255,255,255,.97);
        border-bottom:1px solid #e3ebe7;
        box-shadow:0 4px 18px rgba(5,50,60,.05);
        backdrop-filter:blur(14px);
    }

    .player-topnav-logo{
        border:0 !important;
        background:transparent !important;
        padding:0 30px 0 0 !important;
        cursor:pointer;
        flex:0 0 auto;
    }

    .player-topnav-logo .logo{
        margin:0 !important;
    }

    .player-topnav-links{
        display:flex;
        align-items:center;
        gap:3px;
    }

    .player-topnav-links button{
        border:0;
        background:transparent;
        border-radius:10px;
        padding:11px 13px;

        display:flex;
        align-items:center;
        gap:7px;

        color:#153b36;
        font-size:10px;
        font-weight:800;
        cursor:pointer;
        white-space:nowrap;
    }

    .player-topnav-links button i{
        font-style:normal;
        color:#708985;
    }

    .player-topnav-links button.active{
        color:#00a84c;
        background:#effbf4;
    }

    .player-topnav-links button.active i{
        color:#00a84c;
    }

    .player-topnav-spacer{
        flex:1;
    }

    /* Native details dropdowns */
    .player-nav-more,
    .player-profile-menu{
        position:relative;
    }

    .player-nav-more summary,
    .player-profile-menu summary{
        list-style:none;
        cursor:pointer;
    }

    .player-nav-more summary::-webkit-details-marker,
    .player-profile-menu summary::-webkit-details-marker{
        display:none;
    }

    .player-nav-more > summary{
        min-height:41px;
        padding:0 13px;

        border-radius:10px;

        display:flex;
        align-items:center;
        gap:7px;

        font-size:10px;
        font-weight:800;
        color:#153b36;
    }

    .player-nav-more[open] > summary{
        background:#f4f8f6;
    }

    .player-notification{
        width:40px;
        height:40px;

        border:0;
        border-radius:50%;

        background:transparent;
        color:#143b36;

        font-size:17px;
        cursor:pointer;
    }

    .player-notification:hover{
        background:#f3f8f5;
    }

    .player-profile-menu > summary{
        padding:6px 9px;

        display:flex;
        align-items:center;
        gap:8px;

        border-radius:12px;
    }

    .player-profile-menu > summary:hover,
    .player-profile-menu[open] > summary{
        background:#f3f8f5;
    }

    .player-profile-menu > summary .avatar{
        width:34px;
        height:34px;
        flex:0 0 34px;
    }

    .player-profile-menu > summary b{
        font-size:10px;
    }

    .player-profile-menu > summary span{
        font-size:9px;
        color:#708985;
    }

    .player-nav-dropdown,
    .player-profile-dropdown{
        position:absolute;
        top:calc(100% + 10px);
        right:0;

        width:210px;
        padding:7px;

        background:#fff;
        border:1px solid #dbe6e1;
        border-radius:13px;
        box-shadow:0 15px 38px rgba(5,50,60,.15);
    }

    .player-nav-dropdown{
        left:0;
        right:auto;
    }

    .player-nav-dropdown button,
    .player-profile-dropdown button{
        width:100%;
        border:0;
        background:transparent;
        border-radius:8px;

        padding:11px 10px;

        display:flex;
        align-items:center;
        gap:10px;

        text-align:left;
        color:#173b36;
        font-size:9px;
        font-weight:750;
        cursor:pointer;
    }

    .player-nav-dropdown button:hover,
    .player-profile-dropdown button:hover{
        background:#f2f8f5;
    }

    .player-nav-dropdown button i,
    .player-profile-dropdown button i{
        width:18px;
        font-style:normal;
        text-align:center;
    }

    .player-profile-dropdown .signout{
        margin-top:5px;
        padding-top:12px;
        border-top:1px solid #e5ece8;
        color:#d53c35;
        border-radius:0 0 8px 8px;
    }

    /* Existing page header now sits below top nav */
    .player-shell .content > header{
        padding-top:0 !important;
    }

    /* Avatar/name already exist in top nav on desktop */
    .player-shell .content > header .user{
        display:none !important;
    }

    .player-shell .content > header .mobile-menu-toggle,
    .player-shell .content > header .mobile-logo{
        display:none !important;
    }
}

/* Mobile/tablet: keep existing navigation behavior */
@media(max-width:900px){
    .player-topnav{
        display:none !important;
    }
}

/* =========================================================
   PLAYER DESKTOP — REMOVE SIDEBAR COMPLETELY
   ========================================================= */

@media(min-width:901px){

    main.player-shell{
        display:block !important;
        grid-template-columns:none !important;
    }

    main.player-shell > aside.rail{
        display:none !important;
        visibility:hidden !important;
        width:0 !important;
        min-width:0 !important;
        max-width:0 !important;
        overflow:hidden !important;
    }

    main.player-shell > section.content{
        width:100% !important;
        max-width:none !important;
        margin-left:0 !important;
        padding-left:38px !important;
        padding-right:38px !important;
    }

}

/* =========================================================
   4R PLAYER DESKTOP — GREEN TOP HEADER
   ========================================================= */

@media(min-width:901px){

    .player-topnav{
        background:
            linear-gradient(
                105deg,
                #063b43 0%,
                #07583e 48%,
                #078f47 100%
            ) !important;

        border-bottom:0 !important;
        box-shadow:0 8px 26px rgba(4,55,48,.18) !important;
    }

    .player-topnav-links button{
        color:#ffffff !important;
        background:transparent !important;
    }

    .player-topnav-links button i{
        color:#d3eee5 !important;
    }

    .player-topnav-links button.active{
        color:#ffffff !important;
        background:#00c95a !important;
        box-shadow:
            0 0 0 2px rgba(255,255,255,.16),
            0 5px 13px rgba(0,0,0,.13) !important;
    }

    .player-topnav-links button.active i{
        color:#ffffff !important;
    }

    .player-topnav-links button:hover:not(.active){
        background:rgba(255,255,255,.10) !important;
    }

    .player-nav-more > summary{
        color:#ffffff !important;
    }

    .player-nav-more > summary span,
    .player-nav-more > summary i{
        color:#ffffff !important;
    }

    .player-nav-more[open] > summary,
    .player-nav-more > summary:hover{
        background:rgba(255,255,255,.10) !important;
    }

    .player-notification{
        color:#ffffff !important;
    }

    .player-notification:hover{
        background:rgba(255,255,255,.10) !important;
    }

    .player-profile-menu > summary{
        color:#ffffff !important;
        border:1px solid rgba(255,255,255,.18) !important;
        background:rgba(3,43,42,.22) !important;
    }

    .player-profile-menu > summary b{
        color:#ffffff !important;
    }

    .player-profile-menu > summary span{
        color:#d7eee7 !important;
    }

    .player-profile-menu > summary:hover,
    .player-profile-menu[open] > summary{
        background:rgba(0,0,0,.16) !important;
    }

    .player-nav-dropdown,
    .player-profile-dropdown{
        background:#ffffff !important;
        color:#163c37 !important;
    }

    .player-nav-dropdown button,
    .player-profile-dropdown button{
        color:#163c37 !important;
    }

    .player-profile-dropdown .signout{
        color:#d23c36 !important;
    }
}

/* PickleMANIA logo colors on green player header */
.player-topnav-logo .brand-pickle,
.player-topnav-logo .logo-pickle{
    color:#ffffff !important;
}

.player-topnav-logo .brand-mania,
.player-topnav-logo .logo-mania{
    color:#bfff2b !important;
}

/* Player header logo */
.player-topnav-logo .logo{
    color:#ffffff !important;
}

.player-topnav-logo .logo b{
    color:#bfff2b !important;
}

.player-topnav-logo .logo i{
    color:#ffd928 !important;
}

/* =========================================================
   4R PLAYER HEADER POLISH
   Desktop avatar + Mobile green header
   ========================================================= */

/* ---------- DESKTOP PROFILE AVATAR ---------- */

@media(min-width:901px){

    .player-profile-menu > summary{
        display:flex !important;
        align-items:center !important;
        gap:9px !important;
        min-height:44px !important;
    }

    .player-profile-menu > summary .avatar,
    .player-profile-menu > summary img{
        display:block !important;
        visibility:visible !important;
        opacity:1 !important;

        width:34px !important;
        height:34px !important;
        min-width:34px !important;
        max-width:34px !important;

        flex:0 0 34px !important;

        border-radius:50% !important;
        object-fit:cover !important;

        border:2px solid rgba(255,255,255,.70) !important;
        background:#ffffff !important;
    }

}


/* ---------- MOBILE PLAYER TOP HEADER ---------- */

@media(max-width:900px){

    .player-shell .content > header{
        background:
            linear-gradient(
                105deg,
                #063b43 0%,
                #07583e 55%,
                #078f47 100%
            ) !important;

        border-bottom:0 !important;
        box-shadow:0 5px 18px rgba(4,55,48,.16) !important;

        padding:12px 14px !important;
        margin-bottom:18px !important;

        border-radius:0 0 16px 16px !important;

        align-items:center !important;
    }

    /* Pickle = white */
    .player-shell .content > header .logo{
        color:#ffffff !important;
    }

    /* MANIA = lime */
    .player-shell .content > header .logo b{
        color:#bfff2b !important;
    }

    /* yellow dot */
    .player-shell .content > header .logo i{
        color:#ffd928 !important;
    }

    /* Hi, Mikko */
    .player-shell .content > header h1,
    .player-shell .content > header small{
        color:#ffffff !important;
    }

    /* Mobile profile photo */
    .player-shell .content > header .user{
        display:flex !important;
        align-items:center !important;
    }

    .player-shell .content > header .user > div{
        display:none !important;
    }

    .player-shell .content > header .user .avatar,
    .player-shell .content > header .user img{
        width:40px !important;
        height:40px !important;
        min-width:40px !important;
        border-radius:50% !important;
        object-fit:cover !important;
        border:2px solid rgba(255,255,255,.8) !important;
    }

    /* Hamburger */
    .player-shell .mobile-menu-toggle{
        background:rgba(255,255,255,.14) !important;
        border:1px solid rgba(255,255,255,.35) !important;
        color:#ffffff !important;
        border-radius:11px !important;
    }

}

/* =========================================================
   4R PLAYER DESKTOP PROFILE PHOTO
   ========================================================= */

@media(min-width:901px){

    .player-profile-menu > summary > span:first-child{
        display:block !important;

        width:34px !important;
        height:34px !important;
        min-width:34px !important;
        flex:0 0 34px !important;

        border-radius:50% !important;

        background-size:cover !important;
        background-position:center !important;
        background-repeat:no-repeat !important;

        border:2px solid rgba(255,255,255,.75) !important;
        background-color:#ffffff !important;

        box-shadow:0 2px 7px rgba(0,0,0,.16) !important;

        font-size:9px !important;
        font-weight:900 !important;

        align-items:center !important;
        justify-content:center !important;
        text-align:center !important;
        line-height:30px !important;

        color:#07583e !important;
    }

    .player-profile-menu > summary > span:first-child.has-photo{
        color:transparent !important;
    }

}

/* =========================================================
   4R PLAYER DESKTOP PROFILE PHOTO
   ========================================================= */

@media(min-width:901px){

    .player-profile-menu > summary > span:first-child{
        display:block !important;

        width:34px !important;
        height:34px !important;
        min-width:34px !important;
        flex:0 0 34px !important;

        border-radius:50% !important;

        background-size:cover !important;
        background-position:center !important;
        background-repeat:no-repeat !important;

        border:2px solid rgba(255,255,255,.75) !important;
        background-color:#ffffff !important;

        box-shadow:0 2px 7px rgba(0,0,0,.16) !important;

        font-size:9px !important;
        font-weight:900 !important;

        align-items:center !important;
        justify-content:center !important;
        text-align:center !important;
        line-height:30px !important;

        color:#07583e !important;
    }

    .player-profile-menu > summary > span:first-child.has-photo{
        color:transparent !important;
    }

}

/* =========================================================
   4R TWO-WEEK DATE NAVIGATION
   ========================================================= */

.date-week-nav{
    display:grid;
    grid-template-columns:44px minmax(0,1fr) 44px;
    align-items:center;
    gap:10px;
    margin:16px 0;
}

.date-week-nav .tap-date-strip,
.date-week-nav .open-date-cards{
    margin:0 !important;
    min-width:0;
}

.date-week-arrow{
    width:42px;
    height:54px;
    border:1px solid #cbded5;
    border-radius:12px;
    background:#fff;
    color:#078d43;
    font-size:28px;
    font-weight:500;
    cursor:pointer;
    display:grid;
    place-items:center;
    box-shadow:0 3px 10px rgba(5,50,60,.06);
}

.date-week-arrow:hover:not(:disabled){
    background:#effbf4;
    border-color:#34c875;
}

.date-week-arrow:disabled{
    opacity:.28;
    cursor:default;
}

.open-play-week-nav{
    margin-top:10px;
}

@media(max-width:700px){

    .date-week-nav{
        grid-template-columns:34px minmax(0,1fr) 34px;
        gap:5px;
    }

    .date-week-arrow{
        width:34px;
        height:48px;
        border-radius:10px;
        font-size:23px;
    }

    .date-week-nav .tap-date-strip,
    .date-week-nav .open-date-cards{
        overflow-x:auto;
        scrollbar-width:none;
    }

    .date-week-nav .tap-date-strip::-webkit-scrollbar,
    .date-week-nav .open-date-cards::-webkit-scrollbar{
        display:none;
    }
}

/* =========================================================
   4R 14-DAY SWIPE DATE STRIP
   ========================================================= */

.swipe-date-strip{
    display:flex !important;
    gap:10px !important;

    overflow-x:auto !important;
    overflow-y:hidden !important;

    scroll-snap-type:x proximity;
    scroll-behavior:smooth;

    padding-bottom:6px !important;

    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
}

.swipe-date-strip::-webkit-scrollbar{
    display:none;
}

.swipe-date-strip > button{
    flex:0 0 114px !important;
    scroll-snap-align:start;
}

.open-date-cards.swipe-date-strip > button{
    flex:0 0 105px !important;
}

@media(max-width:700px){
    .swipe-date-strip{
        gap:7px !important;
        margin-right:-12px !important;
        padding-right:28px !important;
    }

    .swipe-date-strip > button{
        flex:0 0 82px !important;
    }

    .open-date-cards.swipe-date-strip > button{
        flex:0 0 78px !important;
    }
}

/* =========================================================
   4R DESKTOP DATE STRIP ARROWS
   ========================================================= */

.swipe-date-shell{
    display:grid;
    grid-template-columns:42px minmax(0,1fr) 42px;
    align-items:center;
    gap:8px;
}

.desktop-date-arrow{
    width:40px;
    height:56px;

    display:grid;
    place-items:center;

    border:1px solid #cbded5;
    border-radius:12px;

    background:#ffffff;
    color:#078d43;

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

    cursor:pointer;

    box-shadow:0 3px 10px rgba(5,50,60,.07);
}

.desktop-date-arrow:hover{
    background:#effbf4;
    border-color:#32c875;
}

@media(max-width:700px){
    .swipe-date-shell{
        display:block;
    }

    .desktop-date-arrow{
        display:none !important;
    }
}

/* =========================================================
   MOBILE CENTER (+) BUTTON — MATCH HEADER GREEN
   ========================================================= */
@media (max-width: 900px){

    .mobile-bottom-nav .center-action,
    .mobile-bottom-nav .mobile-center-action,
    .mobile-bottom-nav .mobile-plus,
    .mobile-bottom-nav .mobile-fab,
    .bottom-nav .center-action,
    .bottom-nav .mobile-fab,
    .bottom-tabbar .center-action,
    .bottom-tabbar .mobile-fab,
    .mobile-fab,
    .fab-center{
        background: linear-gradient(
            105deg,
            #063b43 0%,
            #07583e 48%,
            #078f47 100%
        ) !important;
        border: 1px solid rgba(255,255,255,.18) !important;
        box-shadow: 0 10px 24px rgba(4,55,48,.28) !important;
    }

    .mobile-bottom-nav .center-action *,
    .mobile-bottom-nav .mobile-center-action *,
    .mobile-bottom-nav .mobile-plus *,
    .mobile-bottom-nav .mobile-fab *,
    .bottom-nav .center-action *,
    .bottom-nav .mobile-fab *,
    .bottom-tabbar .center-action *,
    .bottom-tabbar .mobile-fab *,
    .mobile-fab *,
    .fab-center *{
        color: #ffffff !important;
        fill: #ffffff !important;
        stroke: #ffffff !important;
    }
}

/* =========================================================
   MOBILE CENTER PLUS — MATCH HEADER GREEN
   ========================================================= */

@media(max-width:900px){

    .mobile-nav .plus{
        background:
            linear-gradient(
                105deg,
                #063b43 0%,
                #07583e 48%,
                #078f47 100%
            ) !important;

        color:#ffffff !important;
        border:1px solid rgba(255,255,255,.15) !important;

        box-shadow:
            0 10px 24px rgba(4,55,48,.28) !important;
    }

    .mobile-nav .plus:hover,
    .mobile-nav .plus:active{
        background:
            linear-gradient(
                105deg,
                #063b43 0%,
                #07583e 48%,
                #078f47 100%
            ) !important;
        color:#ffffff !important;
    }
}

/* =========================================================
   4R MULTI-DATE BOOKING CART
   ========================================================= */

.booking-date-summary{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:18px !important;
}

.booking-date-summary > div{
    display:flex;
    flex-direction:column;
    gap:2px;
}

.booking-date-summary span{
    font-weight:900;
    color:#073c38;
}

.booking-date-summary small{
    font-size:10px;
    font-weight:700;
    color:#71847d;
}

.checkout-date-group{
    margin:0 0 18px;
    padding:0;
}

.checkout-date-group h4{
    margin:0 0 8px;
    padding:8px 12px;
    border-radius:10px;
    background:#eef8f2;
    color:#07583e;
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.03em;
}

.checkout-date-group article{
    margin-bottom:7px;
}

@media(max-width:700px){

    .booking-float-items.multi-date-float{
        max-height:180px;
        overflow-y:auto;
    }

    .booking-date-summary{
        gap:10px !important;
    }

}

/* =========================================================
   DARKER GREEN — MATCH SELECTED SLOTS TO TOP HEADER
   ========================================================= */

/* Selected booking cells */
.tap-cell.picked{
    background: linear-gradient(
        135deg,
        #063b43 0%,
        #07583e 52%,
        #078f47 100%
    ) !important;
    border:1px solid #0b8b53 !important;
    color:#ffffff !important;
    box-shadow:0 8px 18px rgba(4,55,48,.18) !important;
}

.tap-cell.picked b,
.tap-cell.picked span,
.tap-cell.picked small,
.tap-cell.picked strong{
    color:#ffffff !important;
}

/* Checkout button */
.booking-float-checkout{
    background: linear-gradient(
        135deg,
        #063b43 0%,
        #07583e 52%,
        #078f47 100%
    ) !important;
    color:#ffffff !important;
    border:1px solid rgba(255,255,255,.18) !important;
    box-shadow:0 8px 18px rgba(4,55,48,.18) !important;
}

.booking-float-checkout:hover{
    filter:brightness(1.04) !important;
}

/* Optional: darker selected count / highlighted green items */
.booking-float-summary strong{
    color:#078f47 !important;
}


/* =========================================================
   4R PLAYER HOME REDESIGN
   ========================================================= */

/* ---------- DESKTOP TOP NAV ---------- */

@media(min-width:901px){

    .player-topnav-links{
        gap:12px !important;
    }

    .player-topnav-links button{
        padding:14px 18px !important;
        gap:0 !important;
    }

    .player-topnav-links button i{
        display:none !important;
    }

    .player-topnav-links button span{
        font-size:13px !important;
        font-weight:800 !important;
    }

    /* notification bell */
    .player-notification{
        position:relative;
        font-size:0 !important;
    }

    .player-notification::before{
        content:"🔔";
        font-size:17px;
        line-height:1;
        filter:grayscale(1) brightness(0) invert(1);
    }

    .player-nav-more{
        display:none !important;
    }
}


/* ---------- HOME ACTION CARDS ---------- */

.home-action-grid{
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:14px;
}

.home-action-card{
    min-height:92px;
    display:flex;
    align-items:center;
    gap:14px;

    padding:18px;

    border:1px solid #d6e4dd;
    border-radius:16px;

    background:#fff;
    color:#07333a;

    text-align:left;
    cursor:pointer;

    box-shadow:0 5px 18px rgba(5,50,60,.06);

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.home-action-card:hover{
    transform:translateY(-2px);
    border-color:#27b86b;
    box-shadow:0 9px 24px rgba(5,50,60,.10);
}

.home-action-card i{
    width:40px;
    height:40px;

    display:grid;
    place-items:center;

    flex:0 0 40px;

    border-radius:12px;
    background:#effbf4;

    color:#078f47;
    font-style:normal;
    font-size:21px;
    font-weight:900;
}

.home-action-card span{
    display:flex;
    flex-direction:column;
    gap:4px;
}

.home-action-card b{
    font-size:14px;
}

.home-action-card small{
    color:#71827c;
    font-size:10px;
}


/* ---------- RECOMMENDED COURTS ---------- */

.home-recommended{
    overflow:hidden;
}

.recommended-court-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
}

.recommended-court-card{
    overflow:hidden;

    border:1px solid #d8e4df;
    border-radius:16px;

    background:#fff;
    cursor:pointer;

    box-shadow:0 5px 18px rgba(5,50,60,.06);

    transition:
        transform .18s ease,
        box-shadow .18s ease;
}

.recommended-court-card:hover{
    transform:translateY(-3px);
    box-shadow:0 10px 28px rgba(5,50,60,.11);
}

.recommended-court-photo{
    height:150px;

    background-size:cover;
    background-position:center;
}

.recommended-court-copy{
    padding:15px 16px 16px;
}

.recommended-court-copy > b{
    display:block;

    margin-bottom:5px;

    color:#062f38;
    font-size:15px;
}

.recommended-court-copy > p{
    min-height:30px;

    margin:0 0 10px;

    color:#71827c;
    font-size:11px;
}

.recommended-court-copy > div{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.recommended-court-copy small{
    padding:4px 8px;

    border-radius:20px;
    background:#f0f5f3;

    color:#51635d;
}

.recommended-court-copy strong{
    color:#078f47;
    font-size:15px;
}


/* ---------- OPEN PLAY CARD AREA ---------- */

.home-open-play-cards .recruitment-card-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
}


/* ---------- UPCOMING ---------- */

.home-upcoming{
    width:100%;
}


/* =========================================================
   MOBILE PLAYER HOME
   ========================================================= */

@media(max-width:700px){

    .player-home-redesign{
        gap:16px !important;
    }

    /* Book Courts full width, then 2x2 */
    .home-action-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:9px;
    }

    .home-action-card{
        min-height:84px;

        padding:13px 12px;
        gap:10px;

        border-radius:14px;
    }

    .home-action-card.book-action{
        grid-column:1 / -1;
        min-height:76px;
    }

    .home-action-card i{
        width:36px;
        height:36px;

        flex-basis:36px;

        font-size:18px;
    }

    .home-action-card b{
        font-size:12px;
    }

    .home-action-card small{
        font-size:9px;
    }


    /* Recommended Courts = horizontal cards */
    .recommended-court-grid{
        display:flex;
        gap:10px;

        overflow-x:auto;

        margin-right:-16px;
        padding-right:24px;
        padding-bottom:5px;

        scroll-snap-type:x proximity;
        scrollbar-width:none;

        -webkit-overflow-scrolling:touch;
    }

    .recommended-court-grid::-webkit-scrollbar{
        display:none;
    }

    .recommended-court-card{
        flex:0 0 78%;
        scroll-snap-align:start;
    }

    .recommended-court-photo{
        height:125px;
    }


    /* Open Play = same card/swipe behavior */
    .home-open-play-cards .recruitment-card-grid{
        display:flex !important;
        gap:10px !important;

        overflow-x:auto !important;

        margin-right:-16px;
        padding-right:24px;
        padding-bottom:5px;

        scroll-snap-type:x proximity;
        scrollbar-width:none;

        -webkit-overflow-scrolling:touch;
    }

    .home-open-play-cards .recruitment-card-grid::-webkit-scrollbar{
        display:none;
    }

    .home-open-play-cards .recruitment-card-grid > article{
        flex:0 0 82% !important;
        scroll-snap-align:start;
    }

}

/* =========================================================
   HERO SLIMMER VERSION
   ========================================================= */

.player-home-redesign .hero{
    min-height:auto !important;
    padding:26px 28px !important;
    border-radius:24px !important;
}

.player-home-redesign .hero > div:first-child{
    max-width:560px !important;
}

.player-home-redesign .hero span{
    margin-bottom:10px !important;
}

.player-home-redesign .hero h2{
    margin:0 0 10px !important;
    line-height:1.02 !important;
}

.player-home-redesign .hero p{
    margin:0 !important;
    max-width:520px !important;
}

.player-home-redesign .hero .ball{
    transform:scale(.88) !important;
}

@media(max-width:700px){
    .player-home-redesign .hero{
        padding:20px 22px !important;
        border-radius:22px !important;
    }

    .player-home-redesign .hero h2{
        margin:0 0 8px !important;
    }

    .player-home-redesign .hero p{
        font-size:12px !important;
        line-height:1.45 !important;
    }

    .player-home-redesign .hero .ball{
        transform:scale(.82) !important;
    }
}

/* =========================================================
   OPEN PLAY CHECKOUT — COURT BOOKING STYLE
   ========================================================= */

.openplay-checkout-page,
.openplay-select-stage{
  display:flex;
  flex-direction:column;
  gap:18px;
}

.openplay-grid-scroll{
  overflow-x:auto;
  padding-bottom:4px;
}

.openplay-schedule-grid{
  display:grid;
  min-width:680px;
  gap:7px;
  align-items:stretch;
}

.openplay-grid-head{
  background:#eef6f3;
  border-radius:12px;
  padding:12px 8px;
  text-align:center;
  font-size:13px;
  font-weight:800;
  color:#07583e;
}

.openplay-grid-head.time{
  color:#62736c;
}

.openplay-slot-time{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:58px;
  color:#263a33;
  font-size:13px;
}

.openplay-slot{
  border:1px solid #d7e4df;
  border-radius:13px;
  min-height:58px;
  padding:8px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  background:#fff;
  cursor:pointer;
}

.openplay-slot b{
  font-size:12px;
}

.openplay-slot small{
  font-size:10px;
  color:#71817b;
}

.openplay-slot.available:hover{
  border-color:#07924b;
  background:#f3fff8;
}

.openplay-slot.picked{
  color:#fff;
  border-color:transparent;
  background:linear-gradient(135deg,#063b43 0%,#07583e 52%,#078f47 100%);
  box-shadow:0 6px 18px rgba(5,91,63,.18);
}

.openplay-slot.picked small,
.openplay-slot.picked b{
  color:#fff;
}

.openplay-slot.unavailable{
  opacity:.42;
  cursor:not-allowed;
  background:#f2f3f3;
}

.openplay-details-form{
  margin-bottom:96px;
}

.openplay-form-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:12px;
  margin-top:16px;
}

.openplay-form-grid label,
.openplay-message-field{
  display:flex;
  flex-direction:column;
  gap:7px;
  font-size:12px;
  font-weight:700;
  color:#41534c;
}

.openplay-form-grid input,
.openplay-form-grid select,
.openplay-message-field textarea{
  border:1px solid #d8e4df;
  border-radius:12px;
  padding:11px 12px;
  background:#fff;
  color:#163029;
}

.openplay-message-field{
  margin-top:14px;
}

.openplay-message-field textarea{
  min-height:92px;
  resize:vertical;
}

.openplay-floating-summary{
  position:fixed;
  left:50%;
  bottom:22px;
  transform:translateX(-50%);
  width:min(900px,calc(100% - 42px));
  z-index:30;
  background:#fff;
  border:1px solid #dce8e3;
  box-shadow:0 16px 50px rgba(17,54,43,.20);
  border-radius:22px;
  padding:14px 16px;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto;
  gap:16px;
  align-items:center;
}

.openplay-floating-summary > div:first-child{
  display:flex;
  flex-direction:column;
  gap:2px;
}

.openplay-floating-summary small{
  font-size:10px;
  letter-spacing:.09em;
  color:#71817b;
}

.openplay-floating-summary b{
  color:#153b31;
}

.openplay-floating-summary span,
.openplay-floating-summary em{
  font-size:11px;
  color:#6c7b76;
  font-style:normal;
}

.openplay-floating-total{
  text-align:right;
}

.openplay-floating-total strong{
  display:block;
  font-size:22px;
  color:#078f47;
}

.openplay-floating-summary > button,
.openplay-continue-button,
.openplay-confirm-booking{
  border:0;
  background:linear-gradient(135deg,#063b43 0%,#07583e 52%,#078f47 100%)!important;
  color:#fff!important;
}

.openplay-review-layout,
.openplay-payment-layout{
  display:grid;
  grid-template-columns:minmax(0,1.55fr) minmax(280px,.75fr);
  gap:18px;
  align-items:start;
}

.openplay-detail-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin:15px 0 24px;
}

.openplay-detail-grid article{
  border:1px solid #e0e9e5;
  background:#f9fbfa;
  border-radius:14px;
  padding:14px;
  display:flex;
  flex-direction:column;
  gap:4px;
}

.openplay-detail-grid article small{
  font-size:10px;
  letter-spacing:.08em;
  color:#74827d;
}

.openplay-detail-grid article b{
  color:#143b31;
}

.openplay-detail-grid article span{
  color:#687973;
  font-size:12px;
}

.openplay-checkout-lines{
  margin:14px 0 24px;
}

.openplay-payment-options{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin:14px 0 22px;
}

.openplay-payment-options button{
  position:relative;
  min-height:82px;
  border:1px solid #dbe6e2;
  border-radius:14px;
  background:#fff;
  text-align:left;
  padding:14px;
  display:flex;
  flex-direction:column;
  gap:4px;
}

.openplay-payment-options button.active{
  border:2px solid #078f47;
  background:#f3fff8;
}

.openplay-payment-options button:disabled{
  opacity:.42;
}

.openplay-payment-options button i{
  position:absolute;
  right:12px;
  top:12px;
  width:22px;
  height:22px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#078f47;
  color:white;
  font-style:normal;
}

.openplay-owner-account{
  margin:14px 0 22px;
  padding:14px;
  border:2px solid #078f47;
  border-radius:14px;
  background:#f3fff8;
  display:grid;
  grid-template-columns:42px 1fr auto;
  align-items:center;
  gap:12px;
}

.openplay-owner-account > span{
  width:38px;
  height:38px;
  border-radius:12px;
  background:#078f47;
  color:#fff;
  display:grid;
  place-items:center;
  font-weight:900;
}

.openplay-owner-account div{
  display:flex;
  flex-direction:column;
}

.openplay-owner-account small{
  color:#61716b;
}

.openplay-owner-account i{
  color:#078f47;
  font-style:normal;
  font-size:20px;
}

.openplay-terms,
.openplay-final-confirm{
  display:flex;
  align-items:flex-start;
  gap:11px;
  border:1px solid #dbe6e2;
  border-radius:14px;
  padding:14px;
  background:#fafcfb;
  margin:10px 0 16px;
  cursor:pointer;
}

.openplay-terms input,
.openplay-final-confirm input{
  margin-top:3px;
  width:18px;
  height:18px;
  accent-color:#078f47;
}

.openplay-terms span,
.openplay-final-confirm span{
  display:flex;
  flex-direction:column;
  gap:3px;
}

.openplay-terms small,
.openplay-final-confirm small{
  color:#6f7f79;
}

.openplay-continue-button,
.openplay-confirm-booking{
  width:100%;
  min-height:48px;
  border-radius:13px;
  font-size:14px;
  font-weight:800;
}

.openplay-review-side{
  position:sticky;
  top:92px;
}

.openplay-review-message{
  border-top:1px solid #e2e9e6;
  margin-top:13px;
  padding-top:13px;
}

.openplay-review-message small{
  font-size:10px;
  letter-spacing:.08em;
  color:#77867f;
}

.openplay-review-message p{
  margin:6px 0 0;
  line-height:1.5;
  color:#314740;
}

.openplay-checkout-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;
}

.openplay-hold-clock{
  padding:10px 16px;
  border-radius:14px;
  background:#eaf8f0;
  display:grid;
  grid-template-columns:auto auto;
  column-gap:9px;
  align-items:center;
}

.openplay-hold-clock small{
  grid-column:1/-1;
  font-size:9px;
  letter-spacing:.1em;
  color:#65736e;
}

.openplay-hold-clock b{
  font-size:22px;
  color:#078f47;
}

.openplay-hold-clock span{
  font-size:11px;
  color:#687872;
}

.openplay-hold-clock.urgent{
  background:#fff1ed;
}

.openplay-hold-clock.urgent b{
  color:#d64c27;
}

.openplay-payment-summary{
  position:sticky;
  top:92px;
}

.openplay-success-page{
  max-width:720px;
  margin:20px auto;
}

.openplay-success-card{
  text-align:center;
  padding:42px 32px!important;
}

.success-check{
  width:64px;
  height:64px;
  margin:0 auto 16px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:#078f47;
  color:#fff;
  font-size:32px;
  font-weight:900;
}

.openplay-success-card h2{
  color:#123d32;
  font-size:28px;
  margin:7px 0 8px;
}

.openplay-success-card p{
  max-width:520px;
  margin:0 auto;
  color:#64736e;
  line-height:1.55;
}

.openplay-success-details{
  margin:22px auto 0;
  max-width:440px;
  border:1px solid #deebe5;
  border-radius:15px;
  background:#f8fbf9;
  padding:15px;
  display:flex;
  flex-direction:column;
  gap:4px;
}

@media(max-width:900px){
  .openplay-form-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .openplay-review-layout,
  .openplay-payment-layout{
    grid-template-columns:1fr;
  }

  .openplay-review-side,
  .openplay-payment-summary{
    position:static;
  }
}

@media(max-width:700px){
  .openplay-detail-grid,
  .openplay-payment-options{
    grid-template-columns:1fr;
  }

  .openplay-form-grid{
    grid-template-columns:1fr 1fr;
  }

  .openplay-floating-summary{
    bottom:76px;
    width:calc(100% - 20px);
    grid-template-columns:1fr auto;
    gap:8px 12px;
    border-radius:18px;
    padding:12px;
  }

  .openplay-floating-summary > button{
    grid-column:1/-1;
    width:100%;
    min-height:43px;
  }

  .openplay-floating-total strong{
    font-size:19px;
  }

  .openplay-details-form{
    margin-bottom:170px;
  }

  .openplay-checkout-top{
    align-items:flex-start;
    flex-direction:column;
  }

  .openplay-hold-clock{
    width:100%;
  }
}

/* ========================================================
   OPEN PLAY — REORDERED FLOW
   ======================================================== */

.openplay-details-first{
  max-width:960px;
  margin:0 auto;
}

.openplay-details-first-card{
  padding:26px!important;
}

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

.openplay-details-continue{
  width:100%;
  margin-top:18px;
  min-height:48px;
  border-radius:13px;
  background:linear-gradient(
    135deg,
    #063b43 0%,
    #07583e 52%,
    #078f47 100%
  )!important;
  color:#fff!important;
}

/* DATE STRIP */

.openplay-date-strip{
  display:flex;
  gap:8px;
  overflow-x:auto;
  padding:12px 2px 16px;
  scrollbar-width:thin;
}

.openplay-date-card{
  flex:0 0 76px;
  min-width:76px;
  min-height:88px;
  border:1px solid #dbe7e2;
  border-radius:15px;
  background:#fff;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  align-items:center!important;
  gap:2px!important;
  padding:8px!important;
  color:#173b32!important;
}

.openplay-date-card small{
  display:block!important;
  font-size:10px!important;
  font-weight:800!important;
  color:#71817b!important;
  line-height:1.1!important;
}

.openplay-date-card strong{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  font-size:25px!important;
  line-height:1!important;
  font-weight:900!important;
  color:#113d32!important;
}

.openplay-date-card span{
  display:block!important;
  font-size:10px!important;
  font-weight:800!important;
  color:#71817b!important;
}

.openplay-date-card.active{
  border-color:#078f47!important;
  background:#edfff4!important;
  box-shadow:0 5px 15px rgba(7,143,71,.12);
}

.openplay-date-card.active strong{
  color:#078f47!important;
}

/* PAYMENT */

.openplay-payment-selected{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  margin:18px 0;
  padding:18px;
  border:1px solid #dce8e3;
  border-radius:16px;
  background:#f8fbf9;
  text-align:center;
}

.openplay-payment-selected h3{
  margin:0;
  color:#07583e;
}

.openplay-payment-qr{
  width:min(230px,80%);
  max-height:230px;
  object-fit:contain;
  border-radius:14px;
  background:#fff;
  border:1px solid #dfe8e4;
  padding:8px;
}

.openplay-proof-upload{
  border-top:1px solid #e1e9e6;
  padding-top:18px;
  margin-top:18px;
  display:flex;
  flex-direction:column;
  gap:12px;
}

.openplay-proof-upload label{
  display:flex;
  flex-direction:column;
  gap:6px;
  font-size:12px;
  font-weight:700;
}

.openplay-proof-upload input{
  border:1px solid #d8e4df;
  border-radius:12px;
  padding:11px 12px;
}

.openplay-upload-button{
  display:inline-flex!important;
  width:max-content;
  border:1px solid #078f47;
  border-radius:12px;
  padding:10px 14px;
  color:#078f47;
  cursor:pointer;
  font-weight:800!important;
}

.openplay-upload-button input{
  display:none;
}

.openplay-receipt-preview{
  width:min(320px,100%);
  max-height:320px;
  object-fit:contain;
  border:1px solid #dfe8e4;
  border-radius:14px;
  background:#fff;
  padding:6px;
}

@media(max-width:800px){
  .openplay-form-grid-first{
    grid-template-columns:1fr 1fr;
  }

  .openplay-date-card{
    flex-basis:68px;
    min-width:68px;
  }
}

@media(max-width:560px){
  .openplay-form-grid-first{
    grid-template-columns:1fr;
  }

  .openplay-details-first-card{
    padding:18px!important;
  }
}

/* =========================================================
   4R HOST OPEN PLAY — MATCH COURT BOOKING TYPOGRAPHY
   ========================================================= */

/* Main wizard / checkout text scale */
.host-create-page,
.owner-host-create-page,
.host-create-form,
.host-create-form button,
.host-create-form input,
.host-create-form select,
.host-create-form textarea{
    font-family:inherit;
}

/* Section overlines and titles */
.host-create-page .title small,
.owner-host-create-page .title small{
    font-size:9px !important;
    letter-spacing:1.3px !important;
}

.host-create-page .title h3,
.owner-host-create-page .title h3{
    font-size:16px !important;
    margin:4px 0 14px !important;
}

/* Intro text */
.host-create-page .panel-intro,
.owner-host-create-page .panel-intro{
    font-size:9px !important;
    line-height:1.5 !important;
}

/* Venue selector — same as Court Booking */
.host-create-form .tap-venue-select{
    font-size:8px !important;
    font-weight:900 !important;
    gap:6px !important;
}

.host-create-form .tap-venue-select select{
    font-size:10px !important;
    padding:10px !important;
}

/* Hero / selected venue */
.host-create-form .tap-booking-cover small{
    font-size:8px !important;
    letter-spacing:1.2px !important;
}

.host-create-form .tap-booking-cover h2{
    font-size:24px !important;
    margin:5px 0 !important;
}

.host-create-form .tap-booking-cover p{
    font-size:10px !important;
}

/* Date cards — EXACT Court Booking scale */
.host-create-form .swipe-date-strip > button{
    min-width:92px !important;
    padding:10px !important;
    border-radius:13px !important;
}

.host-create-form .swipe-date-strip > button small{
    font-size:8px !important;
}

.host-create-form .swipe-date-strip > button b{
    font-size:18px !important;
    line-height:1 !important;
}

.host-create-form .swipe-date-strip > button span{
    font-size:8px !important;
}

/* Court / time column headers */
.host-create-form .tap-grid-head{
    font-size:9px !important;
    padding:9px !important;
    font-weight:900 !important;
}

.host-create-form .tap-time{
    font-size:9px !important;
    padding:9px !important;
}

/* Court slot cells */
.host-create-form .tap-cell{
    min-height:58px !important;
    font-size:8px !important;
}

.host-create-form .tap-cell b,
.host-create-form .tap-cell strong{
    font-size:8px !important;
}

.host-create-form .tap-cell span,
.host-create-form .tap-cell small{
    font-size:8px !important;
}

/* Selected date/time summary */
.host-create-form .host-selected-range small{
    font-size:7px !important;
}

.host-create-form .host-selected-range b{
    font-size:14px !important;
}

.host-create-form .host-selected-range > span{
    font-size:9px !important;
}

/* Open Play Details fields */
.host-create-form label{
    font-size:9px !important;
    font-weight:700 !important;
}

.host-create-form input,
.host-create-form select,
.host-create-form textarea{
    font-size:10px !important;
    padding:10px !important;
}

/* Checkout details */
.host-create-form .summary-session b{
    font-size:11px !important;
}

.host-create-form .summary-session span,
.host-create-form .summary-session small{
    font-size:8px !important;
}

.host-create-form .line{
    font-size:11px !important;
}

.host-create-form .line.total{
    font-size:14px !important;
}

/* Payment heading */
.host-create-form .host-payment-method h4{
    font-size:9px !important;
    letter-spacing:1.2px !important;
}

/* Payment choices — same Court Booking */
.host-create-form .payment-choice-grid button{
    padding:11px !important;
}

.host-create-form .payment-choice-grid button b{
    font-size:10px !important;
}

.host-create-form .payment-choice-grid small{
    font-size:8px !important;
}

/* Receipt / reference area */
.host-create-form .manual-payment-proof b{
    font-size:10px !important;
}

.host-create-form .manual-payment-proof label{
    font-size:8px !important;
}

.host-create-form .manual-payment-proof input{
    font-size:10px !important;
}

.host-create-form .manual-payment-proof > p{
    font-size:8px !important;
}

/* Terms */
.host-create-form .wizard-terms,
.host-create-form .checkout-terms,
.host-create-form label:has(input[type="checkbox"]){
    font-size:9px !important;
}

/* Primary / navigation buttons */
.host-create-form .primary,
.host-create-form .wizard-actions > button,
.host-create-page .checkout-back{
    font-size:9px !important;
    font-weight:800 !important;
}

/* Floating checkout, same as Court Booking */
.host-create-form .booking-float-summary b{
    font-size:11px !important;
}

.host-create-form .booking-float-summary strong{
    font-size:10px !important;
}

.host-create-form .booking-float-checkout{
    font-size:10px !important;
}

/* Error message */
.host-create-form .auth-error{
    font-size:9px !important;
}

/* Mobile keeps same visual scale as Court Booking */
@media(max-width:700px){

    .host-create-form .swipe-date-strip > button{
        min-width:82px !important;
    }

    .host-create-form .tap-booking-cover h2{
        font-size:20px !important;
    }

    .host-create-form .tap-booking-cover p{
        font-size:9px !important;
    }

    .host-create-form .tap-cell{
        font-size:8px !important;
    }
}


/* =========================================================
   4R HOST OPEN PLAY — MATCH COURT BOOKING TYPOGRAPHY
   ========================================================= */

/* Main wizard / checkout text scale */
.host-create-page,
.owner-host-create-page,
.host-create-form,
.host-create-form button,
.host-create-form input,
.host-create-form select,
.host-create-form textarea{
    font-family:inherit;
}

/* Section overlines and titles */
.host-create-page .title small,
.owner-host-create-page .title small{
    font-size:9px !important;
    letter-spacing:1.3px !important;
}

.host-create-page .title h3,
.owner-host-create-page .title h3{
    font-size:16px !important;
    margin:4px 0 14px !important;
}

/* Intro text */
.host-create-page .panel-intro,
.owner-host-create-page .panel-intro{
    font-size:9px !important;
    line-height:1.5 !important;
}

/* Venue selector — same as Court Booking */
.host-create-form .tap-venue-select{
    font-size:8px !important;
    font-weight:900 !important;
    gap:6px !important;
}

.host-create-form .tap-venue-select select{
    font-size:10px !important;
    padding:10px !important;
}

/* Hero / selected venue */
.host-create-form .tap-booking-cover small{
    font-size:8px !important;
    letter-spacing:1.2px !important;
}

.host-create-form .tap-booking-cover h2{
    font-size:24px !important;
    margin:5px 0 !important;
}

.host-create-form .tap-booking-cover p{
    font-size:10px !important;
}

/* Date cards — EXACT Court Booking scale */
.host-create-form .swipe-date-strip > button{
    min-width:92px !important;
    padding:10px !important;
    border-radius:13px !important;
}

.host-create-form .swipe-date-strip > button small{
    font-size:8px !important;
}

.host-create-form .swipe-date-strip > button b{
    font-size:18px !important;
    line-height:1 !important;
}

.host-create-form .swipe-date-strip > button span{
    font-size:8px !important;
}

/* Court / time column headers */
.host-create-form .tap-grid-head{
    font-size:9px !important;
    padding:9px !important;
    font-weight:900 !important;
}

.host-create-form .tap-time{
    font-size:9px !important;
    padding:9px !important;
}

/* Court slot cells */
.host-create-form .tap-cell{
    min-height:58px !important;
    font-size:8px !important;
}

.host-create-form .tap-cell b,
.host-create-form .tap-cell strong{
    font-size:8px !important;
}

.host-create-form .tap-cell span,
.host-create-form .tap-cell small{
    font-size:8px !important;
}

/* Selected date/time summary */
.host-create-form .host-selected-range small{
    font-size:7px !important;
}

.host-create-form .host-selected-range b{
    font-size:14px !important;
}

.host-create-form .host-selected-range > span{
    font-size:9px !important;
}

/* Open Play Details fields */
.host-create-form label{
    font-size:9px !important;
    font-weight:700 !important;
}

.host-create-form input,
.host-create-form select,
.host-create-form textarea{
    font-size:10px !important;
    padding:10px !important;
}

/* Checkout details */
.host-create-form .summary-session b{
    font-size:11px !important;
}

.host-create-form .summary-session span,
.host-create-form .summary-session small{
    font-size:8px !important;
}

.host-create-form .line{
    font-size:11px !important;
}

.host-create-form .line.total{
    font-size:14px !important;
}

/* Payment heading */
.host-create-form .host-payment-method h4{
    font-size:9px !important;
    letter-spacing:1.2px !important;
}

/* Payment choices — same Court Booking */
.host-create-form .payment-choice-grid button{
    padding:11px !important;
}

.host-create-form .payment-choice-grid button b{
    font-size:10px !important;
}

.host-create-form .payment-choice-grid small{
    font-size:8px !important;
}

/* Receipt / reference area */
.host-create-form .manual-payment-proof b{
    font-size:10px !important;
}

.host-create-form .manual-payment-proof label{
    font-size:8px !important;
}

.host-create-form .manual-payment-proof input{
    font-size:10px !important;
}

.host-create-form .manual-payment-proof > p{
    font-size:8px !important;
}

/* Terms */
.host-create-form .wizard-terms,
.host-create-form .checkout-terms,
.host-create-form label:has(input[type="checkbox"]){
    font-size:9px !important;
}

/* Primary / navigation buttons */
.host-create-form .primary,
.host-create-form .wizard-actions > button,
.host-create-page .checkout-back{
    font-size:9px !important;
    font-weight:800 !important;
}

/* Floating checkout, same as Court Booking */
.host-create-form .booking-float-summary b{
    font-size:11px !important;
}

.host-create-form .booking-float-summary strong{
    font-size:10px !important;
}

.host-create-form .booking-float-checkout{
    font-size:10px !important;
}

/* Error message */
.host-create-form .auth-error{
    font-size:9px !important;
}

/* Mobile keeps same visual scale as Court Booking */
@media(max-width:700px){

    .host-create-form .swipe-date-strip > button{
        min-width:82px !important;
    }

    .host-create-form .tap-booking-cover h2{
        font-size:20px !important;
    }

    .host-create-form .tap-booking-cover p{
        font-size:9px !important;
    }

    .host-create-form .tap-cell{
        font-size:8px !important;
    }
}


/* =========================================================
   HOST OPEN PLAY DATE PICKER = COURT BOOKING DATE PICKER
   ========================================================= */

/* keep the date area compact */
.host-create-form .swipe-date-shell{
    position:relative !important;
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
    margin:16px 0 !important;
}

/* date strip itself */
.host-create-form .swipe-date-strip{
    display:flex !important;
    gap:10px !important;
    flex:1 !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    scroll-behavior:smooth !important;
    scrollbar-width:none !important;
    padding:3px 0 !important;
    margin:0 !important;
}

.host-create-form .swipe-date-strip::-webkit-scrollbar{
    display:none !important;
}

/* exact Court Booking card proportions */
.host-create-form .swipe-date-strip > button{
    flex:0 0 142px !important;
    min-width:142px !important;
    min-height:90px !important;

    border:1px solid var(--line) !important;
    border-radius:13px !important;
    background:#fff !important;
    color:var(--ink) !important;

    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    align-items:center !important;

    gap:3px !important;
    padding:10px 8px !important;
}

/* selected date same as Court Booking */
.host-create-form .swipe-date-strip > button.active{
    color:#087f40 !important;
    background:#eafaf0 !important;
    border-color:#20c968 !important;
    box-shadow:none !important;
}

/* weekday */
.host-create-form .swipe-date-strip > button small{
    font-size:8px !important;
    font-weight:500 !important;
    text-transform:uppercase !important;
}

/* DATE NUMBER */
.host-create-form .swipe-date-strip > button b{
    font-size:22px !important;
    font-weight:900 !important;
    line-height:1 !important;
    margin:3px 0 !important;
}

/* month */
.host-create-form .swipe-date-strip > button span{
    color:var(--muted) !important;
    font-size:8px !important;
    text-transform:capitalize !important;
}

/* selected text */
.host-create-form .swipe-date-strip > button.active small,
.host-create-form .swipe-date-strip > button.active b{
    color:#087f40 !important;
}

.host-create-form .swipe-date-strip > button.active span{
    color:#658077 !important;
}

/* arrows - same visual style as Court Booking */
.host-create-form .desktop-date-arrow{
    flex:0 0 50px !important;
    width:50px !important;
    height:70px !important;

    border:1px solid var(--line) !important;
    border-radius:13px !important;
    background:#fff !important;
    color:#079a49 !important;

    display:grid !important;
    place-items:center !important;

    padding:0 !important;
    font-size:27px !important;
    font-weight:400 !important;
    box-shadow:0 4px 12px #173c330a !important;
}

/* no visible browser scrollbar */
.host-create-form .swipe-date-shell{
    overflow:hidden !important;
}


/* MOBILE */
@media(max-width:700px){

    .host-create-form .swipe-date-shell{
        gap:7px !important;
    }

    .host-create-form .swipe-date-strip{
        gap:8px !important;
        padding:2px 0 !important;
    }

    .host-create-form .swipe-date-strip > button{
        flex:0 0 86px !important;
        min-width:86px !important;
        min-height:82px !important;
    }

    .host-create-form .swipe-date-strip > button b{
        font-size:20px !important;
    }

    .host-create-form .desktop-date-arrow{
        display:none !important;
    }
}


/* =========================================================
   4R COURT OWNER + PLAYER COURT PROFILE
   ========================================================= */

.court-owner-profile-editor{
    border-top:1px solid var(--line);
    margin-top:24px;
    padding-top:22px;
}

.court-photo-editor{
    display:grid;
    grid-template-columns:1.4fr 1fr 1fr;
    gap:12px;
    margin:15px 0 20px;
}

.court-photo-upload{
    border:1px solid var(--line);
    background:#f8fbf9;
    border-radius:12px;
    overflow:hidden;
}

.court-photo-preview{
    height:130px;
    background:#e9f2ee;
    background-position:center;
    background-size:cover;
    display:grid;
    place-items:center;
}

.court-photo-upload.main-photo .court-photo-preview{
    height:160px;
}

.court-photo-preview span{
    color:var(--muted);
    font-size:9px;
    font-weight:900;
}

.court-photo-upload>div:last-child{
    padding:11px;
    display:flex;
    flex-direction:column;
    gap:7px;
}

.court-photo-upload b{
    font-size:9px;
}

.court-photo-button,
.court-photo-remove{
    border:1px solid #38ce77;
    color:#078d43;
    background:#fff;
    border-radius:7px;
    padding:8px 9px;
    font-size:8px;
    font-weight:900;
    text-align:center;
    cursor:pointer;
}

.court-photo-button input{
    display:none;
}

.court-photo-remove{
    color:#b9503a;
    border-color:#efb19f;
    background:#fff4f1;
}

.court-profile-info-form{
    display:flex;
    flex-direction:column;
    gap:12px;
}

.court-profile-info-form label{
    display:flex;
    flex-direction:column;
    gap:6px;
    font-size:9px;
    font-weight:800;
}

.court-profile-info-form input,
.court-profile-info-form textarea{
    border:1px solid var(--line);
    background:#fff;
    border-radius:8px;
    padding:10px;
    font:inherit;
    font-size:10px;
}

.court-profile-info-form textarea{
    min-height:88px;
    resize:vertical;
}

.court-profile-info-form label small{
    color:var(--muted);
    font-size:7px;
    font-weight:400;
}

.court-contact-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:10px;
}

.court-hours-preview{
    background:#effbf4;
    border:1px solid #4dd281;
    border-radius:10px;
    display:flex;
    flex-direction:column;
    gap:4px;
    padding:12px;
}

.court-hours-preview small{
    color:#078d43;
    font-size:7px;
    letter-spacing:1px;
    font-weight:900;
}

.court-hours-preview b{
    font-size:12px;
}

.court-hours-preview span{
    color:var(--muted);
    font-size:8px;
}


/* PLAYER COURT PROFILE */

.court-public-profile{
    max-width:1100px;
    margin:0 auto;
}

.court-profile-hero{
    border:1px solid var(--line);
    background:#fff;
    border-radius:18px;
    padding:12px;
}

.court-profile-main-photo{
    min-height:370px;
    color:#fff;
    background:
        linear-gradient(135deg,#064b50,#06934d);
    background-size:cover;
    background-position:center;
    border-radius:14px;
    position:relative;
    overflow:hidden;
}

.court-profile-main-photo>span{
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    color:#cce4dd;
    font-size:10px;
    font-weight:900;
    letter-spacing:2px;
}

.court-profile-main-photo>em{
    position:absolute;
    top:14px;
    right:14px;
    color:#fff;
    background:#032c36c7;
    border-radius:20px;
    padding:6px 10px;
    font-size:8px;
    font-style:normal;
    font-weight:900;
}

.court-profile-identity{
    position:absolute;
    left:24px;
    right:24px;
    bottom:22px;
}

.court-profile-identity small{
    color:var(--lime);
    font-size:8px;
    letter-spacing:1.3px;
    font-weight:900;
}

.court-profile-identity h2{
    font-size:28px;
    margin:5px 0;
}

.court-profile-identity p{
    color:#d7e9e3;
    margin:0;
    font-size:10px;
}

.court-profile-thumbs{
    display:flex;
    gap:8px;
    margin-top:10px;
}

.court-profile-thumbs button{
    width:90px;
    height:66px;
    border:2px solid transparent;
    border-radius:9px;
    background:#e7f0ec;
    background-position:center;
    background-size:cover;
    color:var(--muted);
    font-size:7px;
}

.court-profile-thumbs button.active{
    border-color:#0bc65a;
}

.court-profile-summary{
    border:1px solid var(--line);
    background:#fff;
    border-radius:15px;
    padding:18px 20px;
}

.court-profile-summary h2{
    margin:0;
    font-size:20px;
}

.court-profile-summary p{
    color:var(--muted);
    margin:5px 0 10px;
    font-size:9px;
}

.court-rating-line{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    align-items:center;
}

.court-rating-line strong,
.court-rating-line span{
    background:#f1f7f4;
    border-radius:18px;
    padding:6px 9px;
    font-size:8px;
}

.court-rating-line strong{
    color:#078d43;
    background:#e6f9ed;
}

.court-profile-actions{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:10px;
}

.court-profile-actions button{
    border:1px solid var(--line);
    background:#fff;
    border-radius:13px;
    min-height:82px;
    padding:12px;
    display:grid;
    grid-template-columns:34px 1fr;
    grid-template-rows:auto auto;
    column-gap:9px;
    align-items:center;
    text-align:left;
    cursor:pointer;
}

.court-profile-actions i{
    grid-row:1/3;
    width:34px;
    height:34px;
    border-radius:50%;
    display:grid;
    place-items:center;
    color:#fff;
    background:#078d43;
    font-style:normal;
    font-size:15px;
}

.court-profile-actions b{
    font-size:10px;
}

.court-profile-actions small{
    color:var(--muted);
    font-size:7px;
}

.court-profile-actions .book{
    background:#ecfbf2;
    border-color:#48d080;
}

.court-profile-actions .openplay i{
    background:#f0a11c;
}

.court-profile-actions .feed i{
    background:#3779c8;
}

.court-profile-actions button.active{
    box-shadow:0 0 0 2px #09b75422;
}

.court-info-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:14px;
}

.court-info-grid .panel{
    min-height:155px;
}

.court-info-grid p{
    color:#4d6661;
    font-size:9px;
    line-height:1.7;
}

.court-amenity-list{
    display:flex;
    flex-wrap:wrap;
    gap:7px;
}

.court-amenity-list span{
    border:1px solid #b9dfc6;
    color:#286048;
    background:#f0faf4;
    border-radius:18px;
    padding:7px 10px;
    font-size:8px;
}

.court-amenity-list i{
    color:#08a84b;
    margin-right:4px;
    font-style:normal;
}

.court-hours-public,
.court-contact-public{
    display:flex;
    flex-direction:column;
    gap:7px;
    margin-top:8px;
}

.court-hours-public b,
.court-contact-public b{
    font-size:11px;
}

.court-hours-public span,
.court-contact-public span{
    color:var(--muted);
    font-size:9px;
}

.court-profile-openplay-list{
    display:flex;
    flex-direction:column;
    gap:8px;
    margin:12px 0;
}

.court-profile-openplay-list article{
    border:1px solid var(--line);
    border-radius:10px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:15px;
    padding:12px;
}

.court-profile-openplay-list article>div{
    display:flex;
    flex-direction:column;
    gap:4px;
}

.court-profile-openplay-list b{
    font-size:10px;
}

.court-profile-openplay-list span,
.court-profile-openplay-list small{
    color:var(--muted);
    font-size:8px;
}

.court-profile-openplay-list strong{
    color:#078d43;
    font-size:13px;
}

.court-feedback-compose{
    background:#f5f9f7;
    border-radius:11px;
    padding:13px;
    margin:12px 0 18px;
}

.court-stars{
    display:flex;
    gap:3px;
    margin-bottom:8px;
}

.court-stars button{
    border:0;
    background:transparent;
    color:#c7d0cd;
    font-size:24px;
    cursor:pointer;
}

.court-stars button.active{
    color:#f0b321;
}

.court-feedback-compose textarea{
    width:100%;
    border:1px solid var(--line);
    background:#fff;
    border-radius:8px;
    min-height:80px;
    padding:10px;
    font:inherit;
    font-size:9px;
}

.court-feedback-list{
    display:flex;
    flex-direction:column;
}

.court-feedback-list article{
    border-top:1px solid var(--line);
    display:grid;
    grid-template-columns:40px 1fr;
    gap:10px;
    padding:13px 0;
}

.court-feedback-list article>div{
    min-width:0;
}

.court-feedback-list header{
    display:flex;
    justify-content:space-between;
    gap:10px;
}

.court-feedback-list b{
    font-size:9px;
}

.court-feedback-list strong{
    color:#e6a515;
    font-size:10px;
}

.court-feedback-list p{
    color:#415b55;
    margin:6px 0;
    font-size:9px;
    line-height:1.5;
}

.court-feedback-list small{
    color:var(--muted);
    font-size:7px;
}

@media(max-width:760px){

    .court-photo-editor{
        display:flex;
        overflow-x:auto;
    }

    .court-photo-upload{
        flex:0 0 230px;
    }

    .court-contact-grid,
    .court-info-grid{
        grid-template-columns:1fr;
    }

    .court-profile-main-photo{
        min-height:265px;
    }

    .court-profile-identity{
        left:17px;
        right:17px;
        bottom:17px;
    }

    .court-profile-identity h2{
        font-size:21px;
    }

    .court-profile-thumbs{
        overflow-x:auto;
    }

    .court-profile-actions{
        grid-template-columns:repeat(3,1fr);
        gap:6px;
    }

    .court-profile-actions button{
        min-height:88px;
        grid-template-columns:1fr;
        grid-template-rows:auto auto auto;
        text-align:center;
        justify-items:center;
        gap:3px;
        padding:8px 5px;
    }

    .court-profile-actions i{
        grid-row:auto;
    }

    .court-profile-openplay-list article{
        align-items:flex-start;
    }
}



/* ==========================================================
   OWNER PROFILE TWO-COLUMN LAYOUT
   ========================================================== */

.owner-profile-grid{
    display:grid;
    grid-template-columns:minmax(260px, .72fr) minmax(0, 1.55fr);
    gap:20px;
    align-items:start;
}

.owner-profile-left,
.owner-profile-right{
    display:flex;
    flex-direction:column;
    gap:20px;
    min-width:0;
}

.owner-profile-left{
    position:sticky;
    top:20px;
}

.owner-profile-photo-card{
    min-height:260px;
}

.owner-account-card .details{
    margin-bottom:0;
}

.owner-account-details{
    grid-template-columns:1fr;
}

.owner-court-info-panel,
.owner-court-config-panel{
    min-width:0;
}

.owner-court-info-panel .owner-venue-head{
    margin-top:0;
    margin-bottom:18px;
}

.owner-court-config-panel .owner-profile-settings{
    margin:0;
}

.owner-court-config-panel .owner-courts-config{
    border-top:1px solid var(--line);
    margin-top:26px;
    padding-top:24px;
}

@media(max-width:1000px){
    .owner-profile-grid{
        grid-template-columns:300px minmax(0,1fr);
    }
}

@media(max-width:760px){
    .owner-profile-grid{
        grid-template-columns:1fr;
    }

    .owner-profile-left{
        position:static;
    }

    .owner-account-details{
        grid-template-columns:1fr 1fr;
    }
}

@media(max-width:520px){
    .owner-account-details{
        grid-template-columns:1fr;
    }
}


/* ==========================================================
   OWNER COURT BASE PRICING
   ========================================================== */

.owner-court-price-card{
    display:flex !important;
    flex-direction:column;
    align-items:stretch !important;
    gap:12px !important;
}

.owner-court-main-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
}

.owner-court-name{
    display:flex;
    flex-direction:column;
    gap:4px;
}

.owner-court-name b{
    font-size:11px;
}

.owner-court-name small{
    color:var(--muted);
    font-size:8px;
}

.owner-inline-rate-form{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:end;
    gap:10px;
    padding-top:11px;
    border-top:1px solid #edf2ef;
}

.owner-inline-rate-form label{
    display:flex;
    flex-direction:column;
    gap:6px;
}

.owner-inline-rate-form label>span{
    font-size:8px;
    font-weight:900;
    color:#536c66;
}

.owner-inline-rate-input{
    display:flex;
    align-items:center;
    min-height:40px;
    border:1px solid var(--line);
    border-radius:9px;
    overflow:hidden;
    background:#fff;
}

.owner-inline-rate-input i{
    padding:0 10px;
    color:#078d43;
    font-size:11px;
    font-weight:900;
    font-style:normal;
}

.owner-inline-rate-input input{
    width:100%;
    min-width:0;
    padding:10px;
    border:0;
    border-left:1px solid var(--line);
    outline:0;
    background:#fff;
    font-size:10px;
    font-weight:800;
}

.owner-inline-rate-form>button{
    min-height:40px;
    border:1px solid #25c966;
    border-radius:9px;
    padding:0 14px;
    background:#effbf4;
    color:#078d43;
    font-size:8px;
    font-weight:900;
    cursor:pointer;
}

.owner-inline-rate-form>button:disabled{
    opacity:.55;
}

.owner-rate-help{
    color:var(--muted);
    font-size:7px;
}

@media(max-width:620px){
    .owner-inline-rate-form{
        grid-template-columns:1fr;
    }

    .owner-inline-rate-form>button{
        width:100%;
    }
}


/* ==========================================================
   OWNER PEAK / SPECIAL PRICING
   ========================================================== */

.owner-peak-pricing{
    margin-top:18px;
    padding-top:18px;
    border-top:1px solid #edf2ef;
}

.owner-pricing-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
    margin-bottom:16px;
}

.owner-pricing-head small{
    display:block;
    margin-bottom:4px;
    color:#078d43;
    font-size:8px;
    font-weight:900;
    letter-spacing:.08em;
}

.owner-pricing-head h3{
    margin:0 0 5px;
    font-size:15px;
}

.owner-pricing-head p{
    margin:0;
    color:var(--muted);
    font-size:8px;
    line-height:1.5;
}

.owner-peak-pricing-form{
    display:grid;
    gap:15px;
    padding:15px;
    border:1px solid #e2eee8;
    border-radius:13px;
    background:#fbfefc;
}

.owner-pricing-field{
    display:flex;
    flex-direction:column;
    gap:8px;
}

.owner-pricing-field>b,
.owner-pricing-rate>span,
.owner-pricing-time-row label>span{
    color:#536c66;
    font-size:8px;
    font-weight:900;
}

.owner-court-chip-grid,
.owner-day-chip-grid{
    display:flex;
    flex-wrap:wrap;
    gap:7px;
}

.owner-court-chip-grid button,
.owner-day-chip-grid button{
    min-height:36px;
    border:1px solid var(--line);
    border-radius:9px;
    padding:0 12px;
    background:#fff;
    color:#536c66;
    font-size:8px;
    font-weight:900;
    cursor:pointer;
}

.owner-court-chip-grid button span{
    display:inline-block;
    min-width:11px;
}

.owner-court-chip-grid button.active,
.owner-day-chip-grid button.active{
    border-color:#1dbd5c;
    background:#effbf4;
    color:#078d43;
}

.owner-pricing-time-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
}

.owner-pricing-time-row label{
    display:flex;
    flex-direction:column;
    gap:6px;
}

.owner-pricing-time-row input{
    min-height:40px;
    border:1px solid var(--line);
    border-radius:9px;
    padding:0 10px;
    background:#fff;
    font-size:9px;
    font-weight:800;
}

.owner-pricing-rate{
    display:flex;
    flex-direction:column;
    gap:6px;
}

.owner-pricing-rate>div{
    display:flex;
    align-items:center;
    min-height:42px;
    border:1px solid var(--line);
    border-radius:9px;
    overflow:hidden;
    background:#fff;
}

.owner-pricing-rate i{
    padding:0 12px;
    color:#078d43;
    font-style:normal;
    font-size:12px;
    font-weight:900;
}

.owner-pricing-rate input{
    width:100%;
    min-width:0;
    min-height:40px;
    border:0;
    border-left:1px solid var(--line);
    padding:0 11px;
    outline:0;
    background:#fff;
    font-size:10px;
    font-weight:800;
}

.owner-add-pricing-rule{
    min-height:42px;
    border:0;
    border-radius:10px;
    background:#078d43;
    color:#fff;
    font-size:9px;
    font-weight:900;
    cursor:pointer;
}

.owner-add-pricing-rule:disabled{
    opacity:.55;
}

.owner-pricing-rules{
    margin-top:16px;
}

.owner-pricing-rules-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    margin-bottom:10px;
}

.owner-pricing-rules-head>b{
    font-size:10px;
}

.owner-pricing-rules-head>span{
    color:var(--muted);
    font-size:8px;
    font-weight:800;
}

.owner-pricing-rule-list{
    display:grid;
    gap:9px;
}

.owner-pricing-rule-list article{
    border:1px solid #e2eee8;
    border-radius:11px;
    padding:12px;
    background:#fff;
}

.owner-pricing-rule-main{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.owner-pricing-rule-main>div{
    display:flex;
    flex-direction:column;
    gap:4px;
}

.owner-pricing-rule-main b{
    font-size:9px;
}

.owner-pricing-rule-main small{
    color:var(--muted);
    font-size:7px;
}

.owner-pricing-rule-main strong{
    white-space:nowrap;
    color:#078d43;
    font-size:11px;
}

.owner-pricing-rule-foot{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    margin-top:9px;
    padding-top:9px;
    border-top:1px solid #edf2ef;
}

.owner-pricing-rule-foot span{
    color:#536c66;
    font-size:8px;
    font-weight:800;
}

.owner-pricing-rule-foot button{
    border:0;
    background:transparent;
    color:#bd3333;
    font-size:8px;
    font-weight:900;
    cursor:pointer;
}

.owner-pricing-empty{
    margin:0;
    padding:12px;
    border:1px dashed #d9e9e1;
    border-radius:10px;
    color:var(--muted);
    text-align:center;
    font-size:8px;
}

@media(max-width:620px){
    .owner-pricing-time-row{
        grid-template-columns:1fr;
    }

    .owner-court-chip-grid button{
        flex:1 1 calc(50% - 7px);
    }
}


/* ==========================================================
   OWNER COURT RENAME
   ========================================================== */

.owner-inline-name-form{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:end;
    gap:10px;
    padding-top:11px;
    border-top:1px solid #edf2ef;
}

.owner-inline-name-form label{
    display:flex;
    flex-direction:column;
    gap:6px;
}

.owner-inline-name-form label>span{
    font-size:8px;
    font-weight:900;
    color:#536c66;
}

.owner-inline-name-form input{
    width:100%;
    min-width:0;
    min-height:40px;
    border:1px solid var(--line);
    border-radius:9px;
    padding:0 10px;
    outline:0;
    background:#fff;
    font-size:10px;
    font-weight:800;
}

.owner-inline-name-form>button{
    min-height:40px;
    border:1px solid #25c966;
    border-radius:9px;
    padding:0 14px;
    background:#effbf4;
    color:#078d43;
    font-size:8px;
    font-weight:900;
    cursor:pointer;
}

.owner-inline-name-form>button:disabled{
    opacity:.55;
}

@media(max-width:620px){
    .owner-inline-name-form{
        grid-template-columns:1fr;
    }

    .owner-inline-name-form>button{
        width:100%;
    }
}


/* ==========================================================
   OWNER CONFIGURATION PAGE
   ========================================================== */

.owner-configuration-grid{
    grid-template-columns:minmax(0,1fr);
}

.owner-configuration-grid .owner-profile-right{
    width:100%;
    max-width:none;
    grid-column:1;
}

.owner-configuration-grid .owner-court-config-panel{
    width:100%;
}

/* ==========================================================
   INACTIVE COURTS
   ========================================================== */

.show-inactive-courts{
  width:100%;
  min-height:48px;
  margin-top:14px;
  border:1px dashed #a9cbbd;
  border-radius:14px;
  background:#f7fbf9;
  color:#24634b;
  font-weight:700;
  cursor:pointer;
}

.show-inactive-courts:hover{
  background:#eef8f3;
}



/* ==========================================================
   ACTIVE PAYMENT HOLD / REFRESH RECOVERY
   ========================================================== */

.payment-recovery-page{
  max-width:920px;
  margin:0 auto;
  padding:18px 0 42px
}

.payment-recovery-card{
  overflow:hidden;
  border:1px solid rgba(17,126,82,.18);
  box-shadow:0 18px 55px rgba(20,71,50,.10)
}

.payment-recovery-card>header{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  gap:16px;
  align-items:center;
  padding:22px;
  border-radius:18px;
  background:linear-gradient(135deg,#eefcf4,#f7fffa);
  border:1px solid rgba(25,140,88,.16)
}

.payment-recovery-icon{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#139660;
  color:white;
  font-size:22px;
  font-weight:900
}

.payment-recovery-card header small{
  display:block;
  margin-bottom:4px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.12em;
  color:#16865a
}

.payment-recovery-card header h2{
  margin:0;
  font-size:clamp(20px,2.5vw,28px);
  line-height:1.15
}

.payment-recovery-card header p{
  margin:6px 0 0;
  color:#62726b
}

.payment-recovery-timer{
  min-width:104px;
  padding:12px 14px;
  text-align:center;
  border-radius:14px;
  background:#fff;
  border:1px solid rgba(20,130,83,.18);
  color:#087247;
  font-size:24px;
  font-variant-numeric:tabular-nums
}

.payment-recovery-venue{
  display:flex;
  justify-content:space-between;
  gap:16px;
  align-items:flex-end;
  padding:22px 4px 12px
}

.payment-recovery-venue b{
  font-size:20px
}

.payment-recovery-venue span{
  color:#748079;
  text-align:right
}

.payment-recovery-items{
  display:grid;
  gap:8px
}

.payment-recovery-items article{
  display:flex;
  justify-content:space-between;
  gap:18px;
  align-items:center;
  padding:14px 16px;
  border:1px solid #e6ece8;
  border-radius:14px;
  background:#fff
}

.payment-recovery-items article div{
  display:grid;
  gap:4px
}

.payment-recovery-items article small{
  color:#728078
}

.payment-recovery-items article>strong{
  white-space:nowrap;
  color:#087247
}

.payment-recovery-total{
  margin-top:14px;
  padding:16px 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-radius:15px;
  background:#f5f8f6
}

.payment-recovery-total span{
  font-weight:700;
  color:#647169
}

.payment-recovery-total strong{
  color:#087247;
  font-size:25px
}

.payment-recovery-actions{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:10px;
  margin-top:18px
}

.payment-recovery-actions button{
  min-height:48px
}

.payment-recovery-cancel{
  padding:0 22px;
  border:1px solid #dce4df;
  border-radius:12px;
  background:#fff;
  color:#526058;
  font-weight:800
}

.payment-recovery-note{
  margin:14px 0 0;
  text-align:center;
  color:#7b8780;
  font-size:13px
}

@media(max-width:650px){
  .payment-recovery-card>header{
    grid-template-columns:auto 1fr
  }

  .payment-recovery-timer{
    grid-column:1/-1;
    width:100%
  }

  .payment-recovery-venue{
    display:grid
  }

  .payment-recovery-venue span{
    text-align:left
  }

  .payment-recovery-actions{
    grid-template-columns:1fr
  }
}



/* ==========================================================
   TEMPORARY COURT HOLD
   ========================================================== */

.tap-cell.held{
  background:#fff4db;
  border-color:#f1a928;
  color:#9a5a00;
  cursor:not-allowed;
}

.tap-cell.held:hover{
  background:#fff4db;
  border-color:#f1a928;
}

.tap-cell.held b{
  color:#a45d00;
  font-weight:900;
}

.tap-cell.held span{
  display:block;
  margin-top:4px;
  color:#a56d20;
  font-size:10px;
  line-height:1.25;
}

.slot-legend i.held{
  background:#f1a928;
}


/* ===== OWNER TEAM / STAFF ===== */

.owner-team-page .booking-page-head>button{
    background:#fff;
    color:#087e41;
}

.owner-team-kpis article:nth-child(2){
    background:#effbf4;
    border-color:#57d487;
}

.owner-team-kpis article:nth-child(3){
    background:#f7faf9;
}

.team-form-panel{
    max-width:980px;
}

.team-member-form{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
    margin-top:14px;
}

.team-member-form label{
    display:flex;
    flex-direction:column;
    gap:6px;
    font-size:9px;
    font-weight:800;
}

.team-member-form input,
.team-member-form select{
    border:1px solid var(--line);
    background:#fff;
    border-radius:8px;
    padding:11px;
    font-size:10px;
}

.team-member-form input:focus,
.team-member-form select:focus{
    outline:2px solid #31cc72;
    outline-offset:1px;
}

.team-member-form .primary{
    grid-column:1/-1;
    max-width:320px;
    margin:5px 0 0;
}

.team-account-list{
    display:flex;
    flex-direction:column;
    margin-top:14px;
}

.team-account-list article{
    display:grid;
    grid-template-columns:46px minmax(180px,1fr) 90px auto;
    align-items:center;
    gap:13px;
    border-top:1px solid var(--line);
    padding:14px 4px;
}

.team-account-list article.disabled{
    opacity:.62;
    background:#fafbfb;
}

.team-avatar{
    width:42px!important;
    height:42px!important;
    flex:none;
}

.team-account-main{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:4px;
}

.team-account-main>div{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:7px;
}

.team-account-main b{
    font-size:11px;
}

.team-account-main span,
.team-account-main small{
    color:var(--muted);
    font-size:8px;
}

.team-account-main em{
    border-radius:20px;
    padding:4px 7px;
    font-size:7px;
    font-style:normal;
    font-weight:900;
}

.team-account-main em.manager{
    color:#4b58a3;
    background:#edf0ff;
}

.team-account-main em.staff{
    color:#087e40;
    background:#e5f9ec;
}

.team-status{
    justify-self:start;
    border-radius:20px;
    padding:6px 9px;
    font-size:7px;
    font-weight:900;
}

.team-status.active{
    color:#078d43;
    background:#e5faed;
}

.team-status.inactive{
    color:#7c8783;
    background:#edf1ef;
}

.team-account-actions{
    display:flex;
    justify-content:flex-end;
    flex-wrap:wrap;
    gap:6px;
}

.team-account-actions button{
    border:1px solid var(--line);
    color:#31534a;
    background:#fff;
    border-radius:7px;
    padding:7px 9px;
    font-size:7px;
    font-weight:900;
}

.team-account-actions button.disable{
    color:#bc4f38;
    border-color:#f0b6a7;
    background:#fff1ed;
}

.team-account-actions button.activate{
    color:#078d43;
    border-color:#50d083;
    background:#ecfbf2;
}

.team-empty{
    text-align:center;
    display:flex;
    flex-direction:column;
    align-items:center;
    padding:42px 20px;
}

.team-empty>span{
    width:58px;
    height:58px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:#e5f9ec;
    color:#08a64a;
    font-size:25px;
}

.team-empty h3{
    margin:13px 0 4px;
    font-size:15px;
}

.team-empty p{
    color:var(--muted);
    font-size:9px;
}

.team-empty .primary{
    width:auto;
}

@media (max-width:800px){
    .team-account-list article{
        grid-template-columns:42px 1fr auto;
    }

    .team-account-actions{
        grid-column:2/-1;
        justify-content:flex-start;
    }
}

@media (max-width:600px){
    .team-member-form{
        grid-template-columns:1fr;
    }

    .team-member-form .primary{
        grid-column:auto;
        max-width:none;
    }

    .team-account-list article{
        grid-template-columns:42px 1fr;
        align-items:start;
    }

    .team-status{
        grid-column:2;
    }

    .team-account-actions{
        grid-column:1/-1;
    }

    .team-account-actions button{
        flex:1;
    }
}


/* ===== OWNER DESKTOP SIDEBAR VIEWPORT FIX ===== */
@media (min-width:901px){

    .rail{
        height:100vh;
        overflow:hidden;
    }

    .rail nav{
        flex:1;
        min-height:0;
        overflow-y:auto;
        overflow-x:hidden;
        padding-right:3px;
        scrollbar-width:thin;
    }

    .rail-foot{
        flex:none;
        margin-top:10px;
        padding-top:8px;
        border-top:1px solid #ffffff20;
        background:inherit;
    }

    .rail nav::-webkit-scrollbar{
        width:5px;
    }

    .rail nav::-webkit-scrollbar-thumb{
        background:#ffffff2d;
        border-radius:10px;
    }
}

/* ===== STAFF OPERATIONS ===== */

.staff-welcome{
    background:linear-gradient(120deg,#063b41,#087d4c);
    color:#fff;
    border-radius:14px;
    padding:24px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:16px;
}

.staff-welcome small{
    font-size:8px;
    font-weight:900;
    letter-spacing:.08em;
    opacity:.75;
}

.staff-welcome h2{
    margin:5px 0;
    font-size:24px;
}

.staff-welcome p{
    margin:0;
    opacity:.82;
    font-size:10px;
}

.staff-role-pill{
    border:1px solid #ffffff55;
    background:#ffffff17;
    border-radius:30px;
    padding:8px 12px;
    font-size:8px;
    font-weight:900;
}

.staff-live-courts{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
    gap:12px;
    margin-top:16px;
}

.staff-live-courts article{
    border:1px solid var(--line);
    border-radius:12px;
    padding:16px;
    display:flex;
    flex-direction:column;
    gap:7px;
}

.staff-live-courts article.available{
    background:#f1fbf5;
}

.staff-live-courts article.booked{
    background:#eef5ff;
}

.staff-live-courts article.held{
    background:#fff6e8;
}

.staff-live-courts article.offline{
    background:#f3f4f4;
    opacity:.65;
}

.staff-live-courts article>div{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
}

.staff-live-courts b{
    font-size:12px;
}

.staff-live-courts strong{
    font-size:10px;
}

.staff-live-courts small{
    color:var(--muted);
    font-size:8px;
}

.staff-live-courts em{
    font-size:7px;
    font-style:normal;
    font-weight:900;
    background:#e6e9e8;
    border-radius:20px;
    padding:4px 6px;
}

.staff-bookings article{
    grid-template-columns:minmax(240px,1fr) auto;
}

.staff-schedule .booking-page-head input[type=date]{
    border:1px solid var(--line);
    border-radius:9px;
    padding:10px 12px;
    background:#fff;
}

.staff-schedule-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
    gap:15px;
    margin-top:16px;
}

.staff-schedule-grid>article{
    border:1px solid var(--line);
    border-radius:12px;
    padding:14px;
}

.staff-schedule-grid h3{
    margin:0 0 10px;
    font-size:12px;
}

.staff-slot-list{
    display:flex;
    flex-direction:column;
    gap:6px;
}

.staff-slot{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:10px;
    padding:9px 10px;
    border-radius:8px;
    font-size:8px;
    background:#f5f7f6;
}

.staff-slot.available{
    background:#ecfaf2;
}

.staff-slot.booking{
    background:#eaf2ff;
}

.staff-slot.blocked{
    background:#f1f1f1;
}

.staff-slot.openplay{
    background:#f4efff;
}

.staff-slot.held{
    background:#fff3dd;
}

.staff-slot em{
    font-style:normal;
    font-weight:900;
}

@media(max-width:700px){
    .staff-welcome{
        align-items:flex-start;
    }

    .staff-bookings article{
        grid-template-columns:1fr;
    }
}

/* =========================================================
   STAFF DASHBOARD V2
   ========================================================= */

.staff-dashboard-v2{
    gap:16px;
}

.staff-live-panel{
    background:#fff;
    border:1px solid var(--line);
    border-radius:14px;
    padding:17px;
    box-shadow:0 10px 28px rgba(20,55,45,.05);
}

.staff-live-heading{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:20px;
}

.staff-live-heading h2{
    margin:0;
    font-size:14px;
}

.staff-live-heading h2 span{
    margin-left:5px;
    color:#08a957;
    font-size:8px;
}

.staff-live-heading p{
    margin:4px 0 0;
    color:var(--muted);
    font-size:8px;
}

.staff-live-heading>small{
    color:var(--muted);
    font-size:7px;
}

.staff-status-summary{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:10px;
    margin-top:15px;
}

.staff-status-summary article{
    display:flex;
    align-items:center;
    gap:11px;
    border-radius:10px;
    padding:11px 13px;
    border:1px solid var(--line);
}

.staff-status-summary article i{
    width:34px;
    height:34px;
    border-radius:9px;
    display:grid;
    place-items:center;
    font-style:normal;
    font-size:16px;
}

.staff-status-summary article b{
    display:block;
    font-size:17px;
}

.staff-status-summary article small{
    display:block;
    margin-top:1px;
    font-size:7px;
}

.staff-status-summary .available{
    background:#f1fbf5;
}

.staff-status-summary .available i{
    background:#ddf7e7;
    color:#08a957;
}

.staff-status-summary .busy{
    background:#f1f7ff;
}

.staff-status-summary .busy i{
    background:#dcecff;
    color:#177ce6;
}

.staff-status-summary .hold{
    background:#fff9ed;
}

.staff-status-summary .hold i{
    background:#fff0c9;
    color:#f1a000;
}

.staff-status-summary .offline{
    background:#f7f8f8;
}

.staff-status-summary .offline i{
    background:#e9eded;
    color:#76817d;
}

.staff-court-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-top:12px;
}

.staff-court-card{
    min-height:180px;
    border:1px solid var(--line);
    border-radius:10px;
    padding:12px;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
}

.staff-court-card h3{
    margin:0;
    font-size:11px;
}

.staff-court-card.available{
    background:#f9fffb;
}

.staff-court-card.busy{
    background:#f6faff;
    border-color:#c8ddfa;
}

.staff-court-card.hold{
    background:#fffaf1;
    border-color:#f4d997;
}

.staff-court-card.offline{
    background:#fafbfb;
    color:#66716e;
}

.mini-court{
    width:100px;
    height:54px;
    margin:16px auto 13px;
    align-self:center;
    position:relative;
    transform:perspective(120px) rotateX(50deg);
    border:3px solid currentColor;
    border-radius:2px;
    opacity:.9;
}

.staff-court-card.available .mini-court{
    color:#12a956;
    background:#59ca82;
}

.staff-court-card.busy .mini-court{
    color:#177ce6;
    background:#65aef5;
}

.staff-court-card.hold .mini-court{
    color:#ee9900;
    background:#ffc95c;
}

.staff-court-card.offline .mini-court{
    color:#aab2b0;
    background:#dfe4e3;
}

.mini-court span{
    position:absolute;
    display:block;
    border-color:#fff;
}

.mini-court .court-center-line{
    left:49%;
    top:0;
    bottom:0;
    border-left:2px solid #fff;
}

.mini-court .court-net{
    left:-3px;
    right:-3px;
    top:48%;
    border-top:3px solid #fff;
}

.mini-court .court-left-box{
    left:0;
    top:22%;
    width:49%;
    border-top:1px solid #fff;
}

.mini-court .court-right-box{
    right:0;
    top:22%;
    width:49%;
    border-top:1px solid #fff;
}

.staff-court-card strong{
    align-self:center;
    padding:5px 9px;
    border-radius:20px;
    font-size:7px;
}

.staff-court-card.available strong{
    background:#ddf7e7;
    color:#078e45;
}

.staff-court-card.busy strong{
    background:#dfedff;
    color:#166fce;
}

.staff-court-card.hold strong{
    background:#fff0c9;
    color:#c98200;
}

.staff-court-card.offline strong{
    background:#e8eceb;
    color:#66716e;
}

.staff-court-card .court-detail{
    margin-top:11px;
    font-size:8px;
}

.staff-court-card small{
    margin-top:3px;
    font-size:7px;
    color:var(--muted);
}

.staff-booking-columns{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
}

.staff-booking-panel{
    min-width:0;
    padding:0;
    overflow:hidden;
}

.staff-table-title{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:10px;
    padding:14px 16px;
    border-bottom:1px solid var(--line);
}

.staff-table-title h3{
    margin:0;
    font-size:11px;
}

.staff-table-title p{
    margin:3px 0 0;
    font-size:7px;
    color:var(--muted);
}

.staff-table-title>span{
    color:#08a957;
    font-size:7px;
    font-weight:900;
}

.staff-table-scroll{
    width:100%;
    overflow-x:auto;
}

.staff-ops-table{
    width:100%;
    border-collapse:collapse;
    min-width:720px;
}

.staff-ops-table th{
    text-align:left;
    background:#f7f9f8;
    color:#52645e;
    padding:8px 9px;
    font-size:6px;
    letter-spacing:.04em;
    text-transform:uppercase;
}

.staff-ops-table td{
    vertical-align:middle;
    padding:10px 9px;
    border-top:1px solid #edf1ef;
    font-size:7px;
}

.staff-ops-table td>b,
.staff-ops-table td>small{
    display:block;
}

.staff-ops-table td>small{
    margin-top:3px;
    color:var(--muted);
}

.staff-ops-table td>em{
    display:inline-block;
    padding:4px 6px;
    border-radius:12px;
    font-style:normal;
    font-size:6px;
    font-weight:900;
}

.staff-ops-table td>em.paid{
    background:#dcf7e6;
    color:#078e45;
}

.staff-ops-table td>em.pending{
    background:#fff0c9;
    color:#b57600;
}

.staff-receipt-cell{
    display:flex;
    align-items:center;
    gap:7px;
}

.staff-receipt-cell img{
    width:34px;
    height:48px;
    object-fit:cover;
    border:1px solid var(--line);
    border-radius:5px;
    cursor:zoom-in;
}

.staff-receipt-cell>div{
    display:flex;
    flex-direction:column;
    gap:4px;
}

.staff-receipt-cell button,
.staff-receipt-cell a{
    border:0;
    background:none;
    color:#1375c9;
    padding:0;
    font-size:6px;
    cursor:pointer;
    text-decoration:none;
    text-align:left;
    white-space:nowrap;
}

.staff-no-receipt{
    color:var(--muted);
    font-size:6px;
}

.staff-row-actions{
    display:flex;
    flex-direction:column;
    gap:5px;
}

.staff-row-actions button{
    border-radius:6px;
    padding:6px 7px;
    font-size:6px;
    font-weight:900;
    white-space:nowrap;
}

.staff-row-actions .confirm{
    color:#078e45;
    border:1px solid #7bd7a0;
    background:#effcf4;
}

.staff-row-actions .decline{
    color:#d94d3a;
    border:1px solid #f1a697;
    background:#fff6f3;
}

.confirmed-label{
    color:#078e45;
    font-size:6px;
    font-weight:900;
    white-space:nowrap;
}

.staff-dashboard-tip{
    padding:10px 14px;
    border:1px solid #ccebd9;
    border-radius:9px;
    background:#f2fbf6;
    font-size:7px;
    color:#466057;
}

.staff-receipt-modal{
    position:fixed;
    inset:0;
    z-index:9999;
    background:rgba(0,20,25,.72);
    display:flex;
    align-items:center;
    justify-content:center;
    padding:25px;
}

.staff-receipt-modal-card{
    width:min(650px,94vw);
    max-height:92vh;
    background:#fff;
    border-radius:14px;
    display:flex;
    flex-direction:column;
    overflow:hidden;
    box-shadow:0 25px 70px rgba(0,0,0,.35);
}

.staff-receipt-modal-head{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:13px 15px;
    border-bottom:1px solid var(--line);
}

.staff-receipt-modal-head b,
.staff-receipt-modal-head small{
    display:block;
}

.staff-receipt-modal-head small{
    margin-top:3px;
    color:var(--muted);
    font-size:8px;
}

.staff-receipt-modal-head button{
    width:34px;
    height:34px;
    border:0;
    border-radius:50%;
    background:#f0f3f2;
    font-size:20px;
    cursor:pointer;
}

.staff-receipt-modal-card>img{
    max-width:100%;
    max-height:68vh;
    object-fit:contain;
    background:#f4f6f5;
}

.staff-receipt-modal-actions{
    display:flex;
    justify-content:flex-end;
    gap:8px;
    padding:12px 15px;
}

.staff-receipt-modal-actions a,
.staff-receipt-modal-actions button{
    border-radius:7px;
    padding:9px 12px;
    font-size:8px;
    font-weight:900;
    text-decoration:none;
}

.staff-receipt-modal-actions a{
    background:#05ad55;
    color:#fff;
}

.staff-receipt-modal-actions button{
    border:1px solid var(--line);
    background:#fff;
}

@media(max-width:1150px){
    .staff-court-grid{
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .staff-booking-columns{
        grid-template-columns:1fr;
    }
}

@media(max-width:780px){
    .staff-status-summary{
        grid-template-columns:repeat(2,1fr);
    }

    .staff-court-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media(max-width:520px){
    .staff-court-grid{
        grid-template-columns:1fr;
    }

    .staff-live-heading{
        flex-direction:column;
    }
}

/* =========================================================
   STAFF BOOKING TABLE - READABILITY FIX
   ========================================================= */

/* Section headings */
.staff-dashboard-v2 .staff-table-title h3{
    font-size:13px !important;
    font-weight:800 !important;
    line-height:1.3 !important;
}

.staff-dashboard-v2 .staff-table-title p{
    font-size:9px !important;
    line-height:1.4 !important;
}

.staff-dashboard-v2 .staff-table-title>span{
    font-size:9px !important;
}

/* Column headings */
.staff-dashboard-v2 .staff-ops-table th{
    font-size:8px !important;
    font-weight:800 !important;
    padding:10px 10px !important;
}

/* Main table text */
.staff-dashboard-v2 .staff-ops-table td{
    font-size:9px !important;
    line-height:1.45 !important;
    padding:13px 10px !important;
}

/* Player / host name */
.staff-dashboard-v2 .staff-ops-table td>b{
    font-size:11px !important;
    font-weight:800 !important;
    line-height:1.35 !important;
}

/* Reference number / time / secondary information */
.staff-dashboard-v2 .staff-ops-table td>small{
    font-size:9px !important;
    line-height:1.45 !important;
    margin-top:4px !important;
}

/* Date */
.staff-dashboard-v2 .staff-ops-table td:nth-child(3)>b{
    font-size:11px !important;
    font-weight:800 !important;
}

/* Time */
.staff-dashboard-v2 .staff-ops-table td:nth-child(3)>small{
    font-size:9px !important;
    font-weight:500 !important;
}

/* Payment status */
.staff-dashboard-v2 .staff-ops-table td>em{
    font-size:8px !important;
    padding:5px 8px !important;
}

/* Receipt buttons */
.staff-dashboard-v2 .staff-receipt-cell button,
.staff-dashboard-v2 .staff-receipt-cell a{
    font-size:8px !important;
    font-weight:700 !important;
}

/* Slightly larger receipt thumbnail */
.staff-dashboard-v2 .staff-receipt-cell img{
    width:42px !important;
    height:58px !important;
}

/* Confirm / Decline buttons */
.staff-dashboard-v2 .staff-row-actions button{
    font-size:8px !important;
    padding:7px 9px !important;
}

/* Confirmed label */
.staff-dashboard-v2 .confirmed-label{
    font-size:8px !important;
}

/* No receipt */
.staff-dashboard-v2 .staff-no-receipt{
    font-size:8px !important;
}


/* ===== STAFF PAYMENT VERIFICATION ===== */

.staff-dashboard-v2 .staff-payment-amount{
    display:block;
    margin-top:6px;
    font-size:11px !important;
    font-weight:900 !important;
    color:#173d33;
    line-height:1.2;
}

.staff-dashboard-v2 .confirmed-label{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:7px 10px;
    border-radius:7px;
    background:#e9faef;
    color:#078e45;
    font-size:9px !important;
    font-weight:900;
}


/* =========================================================
   STAFF LIVE COURT STATUS - FONT +2
   ========================================================= */

/* Main section title */
.staff-dashboard-v2 .staff-live-heading h2{
    font-size:16px !important;
    font-weight:800 !important;
}

/* Live indicator */
.staff-dashboard-v2 .staff-live-heading h2 span{
    font-size:10px !important;
}

/* Description under title */
.staff-dashboard-v2 .staff-live-heading p{
    font-size:10px !important;
    line-height:1.4 !important;
}

/* Auto refresh text */
.staff-dashboard-v2 .staff-live-heading>small{
    font-size:9px !important;
}

/* Top status counters */
.staff-dashboard-v2 .staff-status-summary article b{
    font-size:19px !important;
}

.staff-dashboard-v2 .staff-status-summary article small{
    font-size:9px !important;
}

/* Court names */
.staff-dashboard-v2 .staff-court-card h3{
    font-size:13px !important;
    font-weight:700 !important;
}

/* AVAILABLE / IN USE / HOLD / OFFLINE pill */
.staff-dashboard-v2 .staff-court-card strong{
    font-size:9px !important;
    padding:6px 10px !important;
}

/* Player name / next booking / status detail */
.staff-dashboard-v2 .staff-court-card .court-detail{
    font-size:10px !important;
    font-weight:800 !important;
    line-height:1.35 !important;
}

/* Time / next schedule / offline description */
.staff-dashboard-v2 .staff-court-card small{
    font-size:9px !important;
    line-height:1.4 !important;
}

/* Slightly larger cards for breathing room */
.staff-dashboard-v2 .staff-court-card{
    min-height:195px !important;
    padding:14px !important;
}


/* =========================================================
   STAFF COURT SCHEDULE TIMELINE
   ========================================================= */

.staff-timeline-page{
    gap:14px;
}

.staff-schedule-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:20px;
}

.staff-schedule-head h2{
    margin:0;
    font-size:18px;
    font-weight:900;
}

.staff-schedule-head h2 span{
    margin-left:6px;
    color:#08a957;
    font-size:11px;
}

.staff-schedule-head p{
    margin:5px 0 0;
    color:var(--muted);
    font-size:11px;
}

.staff-schedule-head>small{
    color:var(--muted);
    font-size:10px;
}

.staff-schedule-toolbar{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:16px;
    padding:12px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:11px;
}

.staff-date-controls{
    display:flex;
    align-items:center;
    gap:7px;
}

.staff-date-controls input,
.staff-date-controls button{
    height:38px;
    border:1px solid var(--line);
    border-radius:8px;
    background:#fff;
    padding:0 12px;
    font-size:10px;
    font-weight:700;
}

.staff-date-controls button{
    cursor:pointer;
}

.staff-date-controls button:disabled{
    opacity:.35;
    cursor:not-allowed;
}

.staff-schedule-legend{
    display:flex;
    flex-wrap:wrap;
    gap:16px;
    font-size:9px;
    font-weight:700;
}

.staff-schedule-legend span{
    display:flex;
    align-items:center;
    gap:6px;
}

.staff-schedule-legend span:before{
    content:"";
    width:10px;
    height:10px;
    border-radius:3px;
}

.staff-schedule-legend .available:before{
    background:#54c987;
}

.staff-schedule-legend .booked:before{
    background:#559be8;
}

.staff-schedule-legend .hold:before{
    background:#f5ad32;
}

.staff-schedule-legend .openplay:before{
    background:#a46be3;
}

.staff-schedule-legend .blocked:before{
    background:#8d9894;
}

.staff-schedule-legend .past:before{
    background:#dfe4e2;
}

.staff-local-time-note{
    border:1px solid #ccebd9;
    background:#f1fbf5;
    color:#2e7250;
    border-radius:9px;
    padding:10px 13px;
    font-size:10px;
}

.staff-timeline-card{
    position:relative;
    border:1px solid var(--line);
    background:#fff;
    border-radius:12px;
    overflow:hidden;
}

.staff-timeline-scroll{
    overflow-x:auto;
}

.staff-timeline-table{
    width:100%;
}

.staff-timeline-header,
.staff-timeline-row{
    display:grid;
    grid-template-columns:190px 1fr;
}

.staff-timeline-header{
    border-bottom:1px solid var(--line);
}

.staff-court-column-title{
    display:flex;
    align-items:center;
    padding:13px 15px;
    font-size:9px;
    font-weight:900;
    color:#667872;
    border-right:1px solid var(--line);
}

.staff-timeline-hours{
    position:relative;
    display:grid;
    grid-template-columns:repeat(var(--staff-slot-count),1fr);
}

.staff-hour-cell{
    padding:13px 5px;
    text-align:center;
    border-right:1px solid #edf0ef;
    font-size:9px;
    font-weight:800;
    white-space:nowrap;
}

.staff-timeline-row{
    min-height:82px;
    border-bottom:1px solid var(--line);
}

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

.staff-court-label{
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:12px 15px;
    border-right:1px solid var(--line);
}

.staff-court-label>b{
    font-size:12px;
    font-weight:900;
}

.staff-court-label>span{
    display:flex;
    align-items:center;
    gap:6px;
    margin-top:5px;
    font-size:9px;
}

.staff-court-label>span i{
    width:7px;
    height:7px;
    border-radius:50%;
    background:currentColor;
}

.staff-court-label .available{
    color:#08a957;
}

.staff-court-label .booked{
    color:#1879df;
}

.staff-court-label .hold{
    color:#df9200;
}

.staff-court-label .openplay{
    color:#8f49d3;
}

.staff-court-label .blocked,
.staff-court-label .offline{
    color:#8b9692;
}

.staff-court-label small{
    margin-top:4px;
    color:var(--muted);
    font-size:8px;
}

.staff-timeline-cells{
    position:relative;
    min-height:82px;
    background:#f4fcf7;
    overflow:hidden;
}

.staff-timeline-slot{
    position:absolute;
    top:0;
    bottom:0;
    border-right:1px solid #e7efeb;
}

.staff-timeline-slot.past{
    background:
    repeating-linear-gradient(
        135deg,
        rgba(120,130,126,.05),
        rgba(120,130,126,.05) 6px,
        rgba(255,255,255,.10) 6px,
        rgba(255,255,255,.10) 12px
    );
}

.staff-timeline-cells.offline{
    background:
    repeating-linear-gradient(
        135deg,
        #f6f7f7,
        #f6f7f7 8px,
        #eef1f0 8px,
        #eef1f0 16px
    );
}

.staff-offline-message{
    position:absolute;
    inset:0;
    display:grid;
    place-items:center;
    color:#66716d;
    font-size:10px;
    font-weight:800;
}

.staff-timeline-event{
    position:absolute;
    top:13px;
    min-width:80px;
    height:56px;
    border-radius:7px;
    padding:8px 10px;
    z-index:3;
    overflow:hidden;
    box-sizing:border-box;
}

.staff-timeline-event b,
.staff-timeline-event span,
.staff-timeline-event small{
    display:block;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.staff-timeline-event b{
    font-size:10px;
    font-weight:900;
}

.staff-timeline-event span{
    margin-top:2px;
    font-size:8px;
}

.staff-timeline-event small{
    margin-top:4px;
    font-size:8px;
}

.staff-timeline-event.booked{
    color:#145eb6;
    background:#dcecff;
    border:1px solid #559be8;
}

.staff-timeline-event.hold{
    color:#a86800;
    background:#fff1cb;
    border:1px solid #f5ad32;
}

.staff-timeline-event.openplay{
    color:#6f2bb5;
    background:#eee0ff;
    border:1px solid #a46be3;
}

.staff-timeline-event.blocked{
    color:#5d6864;
    background:#e8ecea;
    border:1px solid #99a39f;
}

.staff-now-marker{
    position:absolute;
    top:0;
    bottom:0;
    width:2px;
    background:#19ad61;
    z-index:5;
    pointer-events:none;
}

.staff-now-marker.header span{
    position:absolute;
    top:-1px;
    left:50%;
    transform:translate(-50%,-100%);
    background:#19ad61;
    color:#fff;
    border-radius:5px;
    padding:4px 6px;
    font-size:8px;
    white-space:nowrap;
}

.staff-now-marker.header{
    top:0;
    bottom:0;
}

@media(max-width:900px){

    .staff-schedule-toolbar{
        align-items:flex-start;
        flex-direction:column;
    }

    .staff-schedule-head{
        flex-direction:column;
    }

}

/* =========================================================
   OWNER LIVE COURT STATUS
   Uses the same design as Staff Dashboard
   ========================================================= */

.owner-dashboard-grid>.owner-live-court-status{
    grid-column:1 / -1;
}

/* Give owner Live Court Status the same readable typography */
.owner-live-court-status .staff-live-heading h2{
    font-size:16px !important;
    font-weight:800 !important;
}

.owner-live-court-status .staff-live-heading h2 span{
    font-size:10px !important;
}

.owner-live-court-status .staff-live-heading p{
    font-size:10px !important;
}

.owner-live-court-status .staff-live-heading>small{
    font-size:9px !important;
}

.owner-live-court-status .staff-status-summary article b{
    font-size:19px !important;
}

.owner-live-court-status .staff-status-summary article small{
    font-size:9px !important;
}

.owner-live-court-status .staff-court-card h3{
    font-size:13px !important;
    font-weight:700 !important;
}

.owner-live-court-status .staff-court-card strong{
    font-size:9px !important;
}

.owner-live-court-status .staff-court-card .court-detail{
    font-size:10px !important;
    font-weight:800 !important;
}

.owner-live-court-status .staff-court-card small{
    font-size:9px !important;
}


/* =========================================================
   OWNER — STAFF STYLE BOOKING PANELS
   ========================================================= */

.owner-dashboard-grid>.owner-staff-booking-copy{
    grid-column:1 / -1;
    width:100%;
}

/*
 * The new Staff-style Court/Open Play tables replace the
 * original Upcoming Bookings panel visually.
 * The old code remains in the bundle for easy rollback.
 */
.owner-dashboard-grid>.upcoming-panel{
    display:none !important;
}

.owner-staff-booking-copy{
    display:flex;
    flex-direction:column;
    gap:12px;
}

/* Use the same readable Staff table sizing */
.owner-staff-booking-copy .staff-table-title h3{
    font-size:13px !important;
    font-weight:800 !important;
}

.owner-staff-booking-copy .staff-table-title p{
    font-size:9px !important;
}

.owner-staff-booking-copy .staff-table-title>span{
    font-size:9px !important;
}

.owner-staff-booking-copy .staff-ops-table th{
    font-size:8px !important;
    font-weight:800 !important;
}

.owner-staff-booking-copy .staff-ops-table td{
    font-size:9px !important;
    line-height:1.45 !important;
    padding:13px 10px !important;
}

.owner-staff-booking-copy .staff-ops-table td>b{
    font-size:11px !important;
    font-weight:800 !important;
}

.owner-staff-booking-copy .staff-ops-table td>small{
    font-size:9px !important;
}

.owner-staff-booking-copy .staff-payment-amount{
    font-size:11px !important;
}

.owner-staff-booking-copy .staff-receipt-cell button,
.owner-staff-booking-copy .staff-receipt-cell a{
    font-size:8px !important;
}

.owner-staff-booking-copy .staff-row-actions button{
    font-size:8px !important;
}

.owner-staff-booking-copy .confirmed-label{
    font-size:9px !important;
}


/* =========================================================
   OWNER UNIFIED COURT BOOKINGS
   Regular + Open Play reservations
   ========================================================= */

.owner-unified-bookings{
    width:100%;
}

.owner-unified-booking-panel{
    width:100%;
}

.owner-unified-title{
    margin-bottom:12px;
}

.owner-unified-table{
    width:100%;
    min-width:1120px;
}

.owner-unified-table th{
    white-space:nowrap;
}

.owner-unified-table td{
    vertical-align:middle;
}

.owner-booking-type{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:58px;
    padding:5px 9px;
    border-radius:999px;
    font-size:8px;
    font-weight:900;
    white-space:nowrap;
}

.owner-booking-type.regular{
    background:#e8f8ee;
    color:#18864a;
}

.owner-booking-type.openplay{
    background:#f0e7ff;
    color:#7542bd;
}

.owner-booking-courts{
    display:block;
    max-width:160px;
    white-space:normal;
    line-height:1.35;
}

.owner-row-status{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:4px;
}

.owner-row-status span{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:5px 10px;
    border-radius:999px;
    font-size:8px;
    font-weight:900;
}

.owner-row-status small{
    font-size:8px !important;
    font-weight:700;
}

.owner-row-status.paid span{
    background:#dcf7e5;
    color:#078e45;
}

.owner-row-status.paid small{
    color:#078e45;
}

.owner-row-status.pending span{
    background:#fff1cf;
    color:#aa6b00;
}

.owner-row-status.pending small{
    color:#aa6b00;
}

.owner-booking-table-footer{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:15px;
    padding-top:13px;
    margin-top:8px;
    border-top:1px solid var(--line);
    color:var(--muted);
    font-size:9px;
}

.owner-booking-table-footer small{
    font-size:9px;
}

@media(max-width:900px){

    .owner-booking-table-footer{
        flex-direction:column;
        align-items:flex-start;
    }

}


/* =========================================================
   OWNER DASHBOARD V3
   ========================================================= */

.owner-dashboard-v3{
    display:flex;
    flex-direction:column;
    gap:14px;
}

.od3-welcome{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:14px;
    padding:18px 22px;
}

.od3-welcome-main{
    display:flex;
    align-items:center;
    gap:17px;
}

.od3-venue-avatar{
    width:66px;
    height:66px;
    flex:0 0 66px;
    display:grid;
    place-items:center;
    border-radius:50%;
    border:1px solid var(--line);
    background:#f0fbf5;
    color:#08a653;
    font-size:25px;
    font-weight:900;
}

.od3-welcome-main p{
    margin:0;
    font-size:11px;
}

.od3-welcome-main h2{
    margin:3px 0;
    font-size:21px;
    font-weight:900;
}

.od3-welcome-main small{
    font-size:9px;
    color:var(--muted);
}

.od3-venue-status{
    min-width:205px;
    padding:13px 17px;
    border:1px solid var(--line);
    border-radius:11px;
    display:flex;
    flex-direction:column;
    gap:4px;
}

.od3-venue-status span{
    font-size:9px;
}

.od3-venue-status span i{
    display:inline-block;
    width:7px;
    height:7px;
    border-radius:50%;
    background:#09ab56;
    margin-right:5px;
}

.od3-venue-status>b{
    color:#079a4e;
    font-size:17px;
}

.od3-venue-status small{
    color:var(--muted);
    font-size:8px;
}


/* KPI */

.od3-kpis{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:14px;
}

.od3-kpis article{
    display:flex;
    align-items:center;
    gap:14px;
    padding:15px 17px;
    min-height:86px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:13px;
}

.od3-kpis article>i{
    width:50px;
    height:50px;
    flex:0 0 50px;
    display:grid;
    place-items:center;
    border-radius:10px;
    font-size:21px;
    font-style:normal;
    font-weight:900;
}

.od3-kpis i.green{
    color:#079c4c;
    background:#e2f7e9;
}

.od3-kpis i.blue{
    color:#087bcf;
    background:#e2f0ff;
}

.od3-kpis i.orange{
    color:#d97800;
    background:#fff1ce;
}

.od3-kpis i.purple{
    color:#8850ce;
    background:#eee4ff;
}

.od3-kpis article div{
    display:flex;
    flex-direction:column;
    gap:2px;
}

.od3-kpis article div>b{
    font-size:19px;
    font-weight:900;
}

.od3-kpis article div>span{
    font-size:9px;
    font-weight:700;
}

.od3-kpis article div>small{
    font-size:8px;
    color:var(--muted);
}


/* ANALYTICS */

.od3-analytics{
    display:grid;
    grid-template-columns:1fr 1.15fr 1.15fr;
    gap:14px;
}

.od3-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:13px;
    padding:16px;
    min-width:0;
}

.od3-over{
    display:block;
    font-size:8px;
    font-weight:900;
    letter-spacing:.05em;
}

.od3-card>p{
    margin:5px 0 15px;
    font-size:9px;
    color:#42564f;
}


/* DEMOGRAPHICS */

.od3-demographics{
    min-height:165px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:25px;
}

.od3-donut{
    --od3-returning:0%;
    width:128px;
    height:128px;
    flex:0 0 128px;
    border-radius:50%;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    background:
      radial-gradient(circle,#fff 0 55%,transparent 56%),
      conic-gradient(
        #05b756 0 var(--od3-returning),
        #d7eccf var(--od3-returning) 100%
      );
}

.od3-donut strong{
    font-size:20px;
    color:#078d46;
}

.od3-donut small{
    font-size:8px;
}

.od3-demo-legend{
    display:flex;
    flex:1;
    flex-direction:column;
    gap:10px;
}

.od3-demo-legend span{
    display:grid;
    grid-template-columns:9px 1fr auto;
    align-items:center;
    gap:7px;
}

.od3-demo-legend i{
    width:8px;
    height:8px;
    border-radius:50%;
}

.od3-demo-legend i.returning{
    background:#06b254;
}

.od3-demo-legend i.new{
    background:#d7eccf;
}

.od3-demo-legend label,
.od3-demo-legend b{
    font-size:8px;
}

.od3-card>footer{
    margin-top:8px;
    padding-top:10px;
    border-top:1px solid var(--line);
    display:flex;
    justify-content:space-between;
    font-size:8px;
}


/* BAR LIST */

.od3-bar-list{
    display:flex;
    flex-direction:column;
    gap:13px;
}

.od3-bar-list>div{
    display:grid;
    grid-template-columns:80px 1fr 38px;
    align-items:center;
    gap:9px;
}

.od3-bar-list label{
    display:flex;
    flex-direction:column;
}

.od3-bar-list label>b{
    font-size:8px;
}

.od3-bar-list label>small{
    font-size:7px;
    color:var(--muted);
}

.od3-bar-list>div>span,
.od3-performance>div>span{
    height:6px;
    background:#edf1ef;
    border-radius:999px;
    overflow:hidden;
}

.od3-bar-list span i,
.od3-performance span i{
    display:block;
    height:100%;
    border-radius:999px;
    background:#0aa34d;
}

.od3-bar-list strong,
.od3-performance strong{
    text-align:right;
    font-size:8px;
    color:#087d3e;
}


/* PERFORMANCE */

.od3-performance{
    display:flex;
    flex-direction:column;
    gap:14px;
}

.od3-performance>div{
    display:grid;
    grid-template-columns:105px 1fr 40px;
    align-items:center;
    gap:9px;
}

.od3-performance label{
    display:flex;
    flex-direction:column;
}

.od3-performance label b{
    font-size:8px;
}

.od3-performance label small{
    font-size:7px;
    color:var(--muted);
}


/* BOTTOM */

.od3-bottom{
    display:grid;
    grid-template-columns:.9fr .9fr 1.65fr 1.25fr;
    gap:14px;
}


/* GLANCE */

.od3-glance{
    display:flex;
    flex-direction:column;
    gap:7px;
}

.od3-glance>span{
    display:flex;
    align-items:center;
    gap:9px;
    border:1px solid var(--line);
    border-radius:8px;
    padding:9px;
}

.od3-glance>span>i{
    width:27px;
    height:27px;
    display:grid;
    place-items:center;
    border-radius:6px;
    background:#edf9f2;
    color:#09a34e;
    font-style:normal;
}

.od3-glance label{
    display:flex;
    flex-direction:column;
}

.od3-glance label b{
    font-size:10px;
}

.od3-glance label small{
    font-size:7px;
    color:var(--muted);
}


/* REVENUE */

.od3-revenue>div{
    display:flex;
    flex-direction:column;
}

.od3-revenue>div>span{
    display:flex;
    justify-content:space-between;
    padding:13px 0;
    border-bottom:1px solid var(--line);
    font-size:8px;
}

.od3-revenue>div>span b{
    color:#069347;
}

.od3-revenue>footer{
    margin-top:11px;
    padding:10px;
    border:0;
    border-radius:7px;
    background:#fff0ea;
    color:#d54d2b;
    font-weight:800;
}


/* CONFIRMATIONS */

.od3-confirmation-list{
    display:flex;
    flex-direction:column;
}

.od3-confirmation-row{
    display:grid;
    grid-template-columns:48px 1fr auto;
    gap:10px;
    align-items:center;
    padding:9px 0;
    border-bottom:1px solid var(--line);
}

.od3-confirmation-row>img{
    width:44px;
    height:56px;
    border-radius:5px;
    border:1px solid var(--line);
    object-fit:cover;
    cursor:pointer;
}

.od3-no-receipt{
    width:44px;
    height:56px;
    border-radius:5px;
    border:1px dashed var(--line);
    display:grid;
    place-items:center;
    text-align:center;
    font-size:6px;
    color:var(--muted);
}

.od3-confirmation-main{
    min-width:0;
}

.od3-confirmation-title{
    display:grid;
    grid-template-columns:minmax(70px,1fr) minmax(75px,1fr) auto;
    align-items:center;
    gap:8px;
}

.od3-confirmation-title>b,
.od3-confirmation-title>strong{
    font-size:8px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.od3-confirmation-title>em{
    font-size:8px;
    font-style:normal;
    font-weight:900;
    color:#ed5700;
}

.od3-confirmation-main>small{
    display:block;
    margin-top:4px;
    font-size:7px;
    color:#52635d;
}

.od3-receipt-actions{
    display:flex;
    gap:9px;
    margin-top:5px;
}

.od3-receipt-actions button,
.od3-receipt-actions a{
    border:0;
    background:transparent;
    padding:0;
    color:#0878d1;
    font-size:7px;
    font-weight:700;
    cursor:pointer;
    text-decoration:none;
}

.od3-confirm-actions{
    display:flex;
    flex-direction:column;
    gap:5px;
}

.od3-confirm-actions button{
    min-width:58px;
    padding:6px 8px;
    border-radius:6px;
    background:#fff;
    font-size:7px;
    font-weight:800;
    cursor:pointer;
}

.od3-confirm-actions button.confirm{
    border:1px solid #29a95c;
    color:#078c43;
}

.od3-confirm-actions button.decline{
    border:1px solid #ff7569;
    color:#e34235;
}


/* NEXT */

.od3-next{
    display:flex;
    flex-direction:column;
}

.od3-next>div{
    display:grid;
    grid-template-columns:125px 1fr 65px;
    align-items:center;
    gap:8px;
    padding:10px 0;
    border-bottom:1px solid var(--line);
}

.od3-next time{
    display:flex;
    flex-direction:column;
}

.od3-next time small{
    font-size:7px;
}

.od3-next time b,
.od3-next strong,
.od3-next span{
    font-size:7px;
}

.od3-refresh{
    padding:10px 13px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:10px;
    font-size:8px;
    color:var(--muted);
}


/* Dashboard no longer uses the old wall */
.owner-dashboard-v3 .owner-wall{
    display:none !important;
}


@media(max-width:1200px){

    .od3-kpis{
        grid-template-columns:1fr 1fr;
    }

    .od3-analytics{
        grid-template-columns:1fr;
    }

    .od3-bottom{
        grid-template-columns:1fr 1fr;
    }

}

@media(max-width:760px){

    .od3-welcome{
        flex-direction:column;
        align-items:stretch;
    }

    .od3-venue-status{
        min-width:0;
    }

    .od3-kpis,
    .od3-bottom{
        grid-template-columns:1fr;
    }

    .od3-demographics{
        flex-direction:column;
    }

    .od3-confirmation-row{
        grid-template-columns:46px 1fr;
    }

    .od3-confirm-actions{
        grid-column:1 / -1;
        flex-direction:row;
        justify-content:flex-end;
    }

}

/* =========================================================
   STAFF QUICK OPERATIONS
   Booking Confirmations + Next 5 Reservations
   ========================================================= */

.staff-quick-ops{
    display:grid;
    grid-template-columns:1.35fr 1fr;
    gap:14px;
}

.staff-quick-ops>article{
    min-width:0;
}

.staff-quick-over{
    display:block;
    font-size:10px;
    font-weight:900;
    letter-spacing:.04em;
}

.staff-quick-ops>article>p{
    margin:5px 0 13px;
    font-size:9px;
    color:var(--muted);
}


/* CONFIRMATIONS */

.staff-confirmation-list{
    display:flex;
    flex-direction:column;
}

.staff-confirmation-item{
    display:grid;
    grid-template-columns:48px 1fr auto;
    gap:10px;
    align-items:center;
    padding:10px 0;
    border-bottom:1px solid var(--line);
}

.staff-confirmation-item:last-child{
    border-bottom:0;
}

.staff-confirmation-item>img{
    width:44px;
    height:56px;
    border:1px solid var(--line);
    border-radius:5px;
    object-fit:cover;
    cursor:pointer;
}

.staff-confirmation-no-receipt{
    width:44px;
    height:56px;
    display:grid;
    place-items:center;
    border:1px dashed var(--line);
    border-radius:5px;
    color:var(--muted);
    text-align:center;
    font-size:7px;
}

.staff-confirmation-details{
    min-width:0;
}

.staff-confirmation-top{
    display:grid;
    grid-template-columns:minmax(80px,1fr) minmax(90px,1fr) auto;
    gap:8px;
    align-items:center;
}

.staff-confirmation-top>b,
.staff-confirmation-top>strong{
    font-size:10px;
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
}

.staff-confirmation-top>em{
    color:#eb5900;
    font-size:10px;
    font-weight:900;
    font-style:normal;
}

.staff-confirmation-details>small{
    display:block;
    margin-top:4px;
    color:var(--muted);
    font-size:8px;
}

.staff-confirmation-receipt-actions{
    display:flex;
    gap:10px;
    margin-top:6px;
}

.staff-confirmation-receipt-actions button,
.staff-confirmation-receipt-actions a{
    padding:0;
    border:0;
    background:transparent;
    color:#087acb;
    font-size:8px;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
}

.staff-confirmation-actions{
    display:flex;
    flex-direction:column;
    gap:5px;
}

.staff-confirmation-actions button{
    min-width:64px;
    padding:7px 9px;
    border-radius:6px;
    background:#fff;
    font-size:8px;
    font-weight:800;
    cursor:pointer;
}

.staff-confirmation-actions .confirm{
    border:1px solid #24aa58;
    color:#078941;
}

.staff-confirmation-actions .decline{
    border:1px solid #ff796e;
    color:#dc4236;
}


/* NEXT FIVE */

.staff-next-reservations-list{
    display:flex;
    flex-direction:column;
}

.staff-next-reservations-list>div{
    display:grid;
    grid-template-columns:145px minmax(90px,1fr) minmax(70px,1fr);
    gap:10px;
    align-items:center;
    padding:12px 0;
    border-bottom:1px solid var(--line);
}

.staff-next-reservations-list>div:last-child{
    border-bottom:0;
}

.staff-next-reservations-list time{
    display:flex;
    flex-direction:column;
}

.staff-next-reservations-list time small{
    font-size:8px;
    color:var(--muted);
}

.staff-next-reservations-list time b,
.staff-next-reservations-list strong,
.staff-next-reservations-list span{
    font-size:9px;
}


/* RESPONSIVE */

@media(max-width:1000px){

    .staff-quick-ops{
        grid-template-columns:1fr;
    }

}

@media(max-width:700px){

    .staff-confirmation-item{
        grid-template-columns:46px 1fr;
    }

    .staff-confirmation-actions{
        grid-column:1 / -1;
        flex-direction:row;
        justify-content:flex-end;
    }

    .staff-next-reservations-list>div{
        grid-template-columns:1fr;
        gap:3px;
    }

}
/* ===== CREATE OPEN PLAY — MOBILE BOTTOM NAV CLEARANCE ===== */
@media (max-width: 560px) {
    .openplay-details-first {
        padding-bottom: 105px;
    }

    .openplay-details-first-card {
        margin-bottom: 8px;
    }

    .openplay-details-continue {
        margin-bottom: 6px;
    }
}

/* ===== PICKLE MANIA MOBILE MENU VISIBILITY FIX ===== */
@media (max-width: 900px) {
    .mobile-menu-backdrop {
        overflow: hidden;
    }

    .mobile-menu-sheet {
        max-height: 92dvh;
        overflow-y: auto;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
        padding-bottom: calc(24px + env(safe-area-inset-bottom));
    }

    .mobile-menu-links {
        flex: 0 0 auto;
    }

    .mobile-signout {
        display: block;
        margin-top: 8px;
        margin-bottom: 8px;
        flex-shrink: 0;
    }
}

@media (max-width: 420px) {
    .mobile-menu-sheet {
        max-height: 94dvh;
    }

    .mobile-menu-links {
        grid-template-columns: 1fr;
    }
}

/* ===== MOBILE BOOKING FLOAT - DO NOT COVER TIME SLOTS ===== */
@media (max-width: 550px) {

    .booking-float {
        bottom: calc(76px + env(safe-area-inset-bottom));
        width: calc(100% - 18px);
        padding: 9px 11px;
        border-radius: 14px;
    }

    .booking-float-top {
        padding-bottom: 0;
        border-bottom: 0;
    }

    /* Keep the mobile balloon compact */
    .booking-float-items {
        display: none;
    }

    /* Allow the last schedule rows to scroll above the floating bar */
    .tap-booking-main,
    .host-tap-schedule {
        padding-bottom: 135px !important;
    }
}
/* ===== SLIMMER TIME SLOT BOXES ===== */
@media (max-width: 700px) {
    .tap-cell,
    .host-create-form .tap-cell {
        min-height: 46px !important;
        padding: 4px 6px !important;
        gap: 2px !important;
        border-radius: 8px !important;
    }

    .tap-cell b,
    .host-create-form .tap-cell b,
    .tap-cell strong,
    .host-create-form .tap-cell strong {
        font-size: 9px !important;
        line-height: 1.1 !important;
        margin: 0 !important;
    }

    .tap-cell span,
    .host-create-form .tap-cell span,
    .tap-cell small,
    .host-create-form .tap-cell small {
        font-size: 7px !important;
        line-height: 1.1 !important;
        margin: 0 !important;
    }
}
/* ===== SLIMMER TIME SLOT BOXES - MOBILE + DESKTOP ===== */
.tap-cell,
.host-create-form .tap-cell {
    min-height: 46px !important;
    padding: 4px 6px !important;
    gap: 2px !important;
    border-radius: 8px !important;
}

.tap-cell b,
.host-create-form .tap-cell b,
.tap-cell strong,
.host-create-form .tap-cell strong {
    font-size: 9px !important;
    line-height: 1.1 !important;
    margin: 0 !important;
}

.tap-cell span,
.host-create-form .tap-cell span,
.tap-cell small,
.host-create-form .tap-cell small {
    font-size: 7px !important;
    line-height: 1.1 !important;
    margin: 0 !important;
}

/* =========================================================
   DEWPOINT PICKLEBALL LANDING PAGE
   BLUE + PURPLE WHITE-LABEL THEME
   ========================================================= */

.dp-site{
    --dp-navy:#03081a;
    --dp-navy2:#091643;
    --dp-blue:#176cff;
    --dp-blue2:#27a4ff;
    --dp-purple:#7829e8;
    --dp-violet:#a42ce4;
    --dp-pink:#dd42d7;
    --dp-white:#fff;
    --dp-soft:#f7f7fc;
    --dp-text:#12152d;
    --dp-muted:#72788d;
    --dp-line:#e4e6f0;

    min-height:100vh;
    width:100%;
    overflow:hidden;
    background:#fff;
    color:var(--dp-text);
    font-family:Arial,Helvetica,sans-serif;
}

.dp-site button{
    font-family:inherit;
    cursor:pointer;
}


/* ===================== TOP NAV ===================== */

.dp-nav{
    height:76px;
    padding:0 clamp(20px,5vw,75px);
    display:flex;
    align-items:center;
    gap:28px;
    color:#fff;
    background:#020615;
    border-bottom:1px solid rgba(255,255,255,.08);
    position:relative;
    z-index:20;
}

.dp-brand{
    min-width:230px;
    padding:0;
    border:0;
    background:transparent;
    color:#fff;
    display:flex;
    align-items:center;
    gap:11px;
    text-align:left;
}

.dp-brand img{
    width:58px;
    height:52px;
    object-fit:contain;
}

.dp-brand>span{
    display:flex;
    flex-direction:column;
}

.dp-brand strong{
    font-size:22px;
    line-height:1;
    font-weight:1000;
    font-style:italic;
    letter-spacing:-.5px;
}

.dp-brand small{
    margin-top:6px;
    font-size:7px;
    letter-spacing:5px;
    font-weight:900;
}

.dp-nav-links{
    flex:1;
    height:100%;
    display:flex;
    align-items:center;
    justify-content:center;
}

.dp-nav-links button,
.dp-login{
    height:100%;
    padding:0 13px;
    border:0;
    background:transparent;
    color:#dce1f5;
    font-size:9px;
    letter-spacing:.7px;
    font-weight:900;
}

.dp-nav-links button:hover,
.dp-login:hover{
    color:#fff;
}

.dp-nav-actions{
    display:flex;
    align-items:center;
    gap:5px;
    height:100%;
}

.dp-book-top{
    border:0;
    border-radius:7px;
    padding:12px 18px;
    color:#fff;
    font-size:9px;
    font-weight:900;
    background:linear-gradient(
        100deg,
        var(--dp-purple),
        var(--dp-blue)
    );
    box-shadow:0 8px 25px rgba(71,64,255,.28);
}


/* ===================== HERO ===================== */

.dp-hero{
    min-height:610px;
    padding:70px clamp(34px,6vw,95px) 95px;
    display:grid;
    grid-template-columns:minmax(0,1.05fr) minmax(380px,.95fr);
    align-items:center;
    gap:35px;
    color:#fff;
    position:relative;
    isolation:isolate;
    overflow:hidden;

    background:
        radial-gradient(
            circle at 82% 20%,
            rgba(153,43,240,.48),
            transparent 24%
        ),
        radial-gradient(
            circle at 71% 80%,
            rgba(19,91,255,.44),
            transparent 32%
        ),
        linear-gradient(
            120deg,
            #020616 0%,
            #071336 48%,
            #18105c 73%,
            #410566 100%
        );
}

.dp-hero:before{
    content:"";
    position:absolute;
    inset:0;
    z-index:-2;
    opacity:.55;
    background:
        repeating-linear-gradient(
            90deg,
            rgba(255,255,255,.018) 0,
            rgba(255,255,255,.018) 1px,
            transparent 1px,
            transparent 75px
        );
}

.dp-hero:after{
    content:"";
    position:absolute;
    z-index:-1;
    left:-5%;
    bottom:-1px;
    width:110%;
    height:62px;
    background:#fff;
    clip-path:polygon(
        0 65%,
        20% 82%,
        44% 67%,
        68% 92%,
        100% 55%,
        100% 100%,
        0 100%
    );
}

.dp-grid-dots{
    position:absolute;
    left:25px;
    top:35px;
    width:320px;
    height:260px;
    opacity:.35;
    background-image:
        radial-gradient(circle,#496dff 1.5px,transparent 1.6px);
    background-size:18px 18px;
}

.dp-hero-copy{
    position:relative;
    z-index:5;
    max-width:690px;
}

.dp-eyebrow{
    display:inline-flex;
    padding:7px 11px;
    border:1px solid rgba(113,126,255,.38);
    border-radius:5px;
    color:#bac9ff;
    background:rgba(17,25,72,.5);
    font-size:8px;
    letter-spacing:2px;
    font-weight:900;
}

.dp-hero h1{
    margin:23px 0 10px;
    font-size:clamp(57px,6vw,90px);
    line-height:.86;
    letter-spacing:-4px;
    font-style:italic;
    font-weight:1000;
    text-shadow:0 12px 35px rgba(0,0,0,.4);
}

.dp-hero h1 em{
    color:transparent;
    font-style:italic;
    background:
        linear-gradient(
            90deg,
            #1580ff,
            #4254ff 38%,
            #9b2ce7 76%,
            #e943d6
        );
    -webkit-background-clip:text;
    background-clip:text;
}

.dp-tagline{
    margin-top:23px;
    color:#fff;
    font-size:14px;
    letter-spacing:8px;
    font-weight:900;
}

.dp-hero-copy>p{
    max-width:570px;
    margin:22px 0 26px;
    color:#cbd2ea;
    font-size:13px;
    line-height:1.8;
}

.dp-hero-buttons{
    display:flex;
    flex-wrap:wrap;
    gap:11px;
}

.dp-primary,
.dp-secondary{
    border:0;
    border-radius:7px;
    padding:15px 21px;
    color:#fff;
    font-size:10px;
    font-weight:900;
    transition:.18s ease;
}

.dp-primary{
    background:
        linear-gradient(
            100deg,
            var(--dp-purple),
            #9d32e3
        );
    box-shadow:0 10px 30px rgba(119,42,231,.32);
}

.dp-secondary{
    background:
        linear-gradient(
            100deg,
            #145cff,
            #238fff
        );
    box-shadow:0 10px 30px rgba(25,99,255,.28);
}

.dp-primary:hover,
.dp-secondary:hover,
.dp-book-top:hover{
    transform:translateY(-2px);
}

.dp-hero-perks{
    display:flex;
    flex-wrap:wrap;
    gap:23px;
    margin-top:27px;
    color:#d9def2;
}

.dp-hero-perks span{
    font-size:8px;
    font-weight:800;
}


/* ===================== HERO PICKLEBALL ART ===================== */

.dp-hero-art{
    min-height:470px;
    display:flex;
    justify-content:center;
    align-items:center;
    position:relative;
}

.dp-hero-art:before{
    content:"";
    position:absolute;
    inset:15% 0 5%;
    border-radius:50%;
    background:
        radial-gradient(
            circle,
            rgba(119,53,255,.28),
            transparent 55%
        );
}

.dp-orbit{
    position:absolute;
    width:500px;
    height:190px;
    border:8px solid transparent;
    border-top-color:#8435f7;
    border-right-color:#1588ff;
    border-radius:50%;
    filter:
        drop-shadow(0 0 13px rgba(81,80,255,.75));
}

.dp-orbit-one{
    transform:rotate(-20deg);
}

.dp-orbit-two{
    width:430px;
    height:140px;
    border-width:4px;
    transform:rotate(18deg);
    opacity:.6;
}

.dp-paddle{
    width:205px;
    height:285px;
    border-radius:57px;
    position:relative;
    z-index:4;
    transform:rotate(24deg) translateY(-20px);
    display:flex;
    align-items:center;
    justify-content:center;

    color:#6f24c8;

    background:
        linear-gradient(#f9f9fc,#e9ebf5) padding-box,
        linear-gradient(
            135deg,
            #1879ff,
            #7f2de7,
            #e94cdb
        ) border-box;

    border:9px solid transparent;

    box-shadow:
        0 0 0 5px #071746,
        0 25px 50px rgba(0,0,0,.42),
        0 0 35px rgba(83,53,255,.4);
}

.dp-paddle span{
    font-size:67px;
    font-style:italic;
    font-weight:1000;
    letter-spacing:-8px;
}

.dp-paddle i{
    width:49px;
    height:175px;
    position:absolute;
    top:260px;
    left:79px;
    border-radius:14px 14px 25px 25px;

    background:
        repeating-linear-gradient(
            0deg,
            #12162d 0 12px,
            #343a5c 12px 17px
        );

    box-shadow:0 15px 30px rgba(0,0,0,.55);
}

.dp-pickleball{
    width:140px;
    height:140px;
    position:absolute;
    left:7%;
    top:54%;
    z-index:6;

    border-radius:50%;
    padding:22px 18px;

    color:#2f375d;
    font-size:28px;
    letter-spacing:14px;
    line-height:42px;
    overflow-wrap:anywhere;

    background:
        radial-gradient(
            circle at 34% 25%,
            #fff,
            #d9dce8 65%,
            #7b849f
        );

    box-shadow:
        inset -15px -12px 20px rgba(35,42,78,.18),
        0 15px 36px rgba(0,0,0,.42);

    transform:rotate(-18deg);
}


/* ===================== STATS ===================== */

.dp-stats{
    max-width:1180px;
    margin:0 auto;
    padding:35px 30px 50px;

    display:grid;
    grid-template-columns:repeat(4,1fr);
}

.dp-stats article{
    text-align:center;
    padding:12px 20px;
    display:flex;
    flex-direction:column;
    align-items:center;
    position:relative;
}

.dp-stats article+article:before{
    content:"";
    position:absolute;
    left:0;
    top:8%;
    bottom:8%;
    width:1px;
    background:#dfe1ea;
}

.dp-stats span{
    color:var(--dp-blue);
    font-size:26px;
}

.dp-stats strong{
    margin-top:8px;
    font-size:30px;
    line-height:1;
    font-weight:1000;

    color:transparent;

    background:
        linear-gradient(
            90deg,
            var(--dp-blue),
            var(--dp-purple)
        );

    -webkit-background-clip:text;
    background-clip:text;
}

.dp-stats b{
    margin-top:7px;
    font-size:10px;
    letter-spacing:.8px;
}

.dp-stats small{
    margin-top:6px;
    color:var(--dp-muted);
    font-size:8px;
}


/* ===================== GENERAL SECTIONS ===================== */

.dp-section{
    padding:
        65px
        clamp(22px,6vw,90px);
}

.dp-section>h2{
    margin:0;
    text-align:center;
    color:#12152d;
    font-size:25px;
    font-weight:1000;
    letter-spacing:5px;
}

.dp-title-line{
    width:78px;
    height:3px;
    margin:13px auto 36px;

    background:
        linear-gradient(
            90deg,
            transparent,
            var(--dp-purple),
            var(--dp-blue),
            transparent
        );
}


/* ===================== SOCIAL ===================== */

.dp-social-grid{
    max-width:1100px;
    margin:0 auto;

    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:20px;
}

.dp-social-grid article{
    min-height:405px;
    padding:21px;

    display:flex;
    flex-direction:column;

    background:#fff;
    border:1px solid var(--dp-line);
    border-radius:10px;

    box-shadow:
        0 9px 28px rgba(16,20,55,.08);
}

.dp-social-icon{
    width:42px;
    height:42px;

    display:grid;
    place-items:center;

    border-radius:9px;

    color:#fff;
    font-size:22px;
    font-weight:900;
}

.dp-social-icon.facebook{
    background:#1968ff;
}

.dp-social-icon.instagram{
    background:
        linear-gradient(
            135deg,
            #ff296e,
            #d93cca
        );
}

.dp-social-icon.community{
    background:
        linear-gradient(
            135deg,
            #6622d9,
            #9632e1
        );
}

.dp-social-grid h3{
    margin:14px 0 3px;
    font-size:13px;
}

.dp-social-grid article>b{
    color:var(--dp-muted);
    font-size:9px;
}

.dp-social-grid p{
    flex:1;
    color:var(--dp-muted);
    font-size:9px;
    line-height:1.7;
}

.dp-photo{
    height:160px;
    margin:17px 0;

    position:relative;
    overflow:hidden;

    border-radius:7px;

    background:
        linear-gradient(
            135deg,
            #174ba4,
            #4631aa 48%,
            #a83fc9
        );
}

.dp-photo:before{
    position:absolute;
    inset:0;

    display:grid;
    place-items:center;

    color:#fff;
    font-size:46px;
}

.dp-photo-players:before{
    content:"♟  ♟  ♟";
}

.dp-photo-court:before{
    content:"â–¦";
}

.dp-social-grid article>button,
.dp-news-grid article>button{
    color:var(--dp-blue);
    border:1px solid #b7c5ff;
    border-radius:5px;
    background:#fff;
    padding:10px;
    font-size:8px;
    font-weight:900;
}

.dp-feed{
    flex:1;
    margin:16px 0;
}

.dp-feed>div{
    display:grid;
    grid-template-columns:25px 1fr;
    align-items:center;
    gap:9px;

    padding:12px 0;
    border-bottom:1px solid #eeeeF4;
}

.dp-feed i{
    width:23px;
    height:23px;
    border-radius:50%;

    background:
        linear-gradient(
            135deg,
            var(--dp-blue),
            var(--dp-purple)
        );
}

.dp-feed span{
    display:flex;
    flex-direction:column;
}

.dp-feed b{
    font-size:8px;
}

.dp-feed small{
    margin-top:3px;
    color:var(--dp-muted);
    font-size:7px;
}


/* ===================== NEWS ===================== */

.dp-news{
    background:#fafafe;
}

.dp-news-grid{
    max-width:1150px;
    margin:0 auto;

    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:17px;
}

.dp-news-grid article{
    overflow:hidden;
    padding-bottom:18px;

    background:#fff;
    border:1px solid var(--dp-line);
    border-radius:9px;

    box-shadow:
        0 7px 22px rgba(16,20,57,.07);
}

.dp-news-image{
    height:150px;
    position:relative;

    background:
        linear-gradient(
            145deg,
            #2148ae,
            #252054 50%,
            #74269e
        );
}

.dp-news-image:after{
    position:absolute;
    inset:0;

    display:grid;
    place-items:center;

    color:#fff;
    font-size:46px;
}

.dp-news-one:after{
    content:"â—‰  â–¦";
}

.dp-news-two:after{
    content:"♟";
}

.dp-news-three:after{
    content:"â™›";
}

.dp-news-four:after{
    content:"DP";
    font-style:italic;
    font-weight:1000;
}

.dp-news-grid em{
    display:inline-block;

    margin:0 15px;
    padding:5px 8px;

    transform:translateY(-11px);

    color:#fff;
    background:
        linear-gradient(
            90deg,
            var(--dp-purple),
            #9e27dc
        );

    font-size:7px;
    font-style:normal;
    font-weight:900;
}

.dp-news-grid h3{
    margin:0 0 9px;
    padding:0 15px;
    font-size:14px;
}

.dp-news-grid p{
    min-height:75px;
    padding:0 15px;

    color:var(--dp-muted);
    font-size:9px;
    line-height:1.6;
}

.dp-news-grid article>button{
    margin:0 15px;
    padding:0;
    border:0;
}


/* ===================== FEATURES ===================== */

.dp-features{
    background:#fafafe;
}

.dp-feature-grid{
    max-width:1080px;
    margin:0 auto;

    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:20px;
}

.dp-feature-grid article{
    min-height:190px;
    padding:28px 23px;

    text-align:center;

    background:#fff;
    border:1px solid #e4e5ee;
    border-radius:8px;

    box-shadow:
        0 9px 27px rgba(19,18,53,.07);
}

.dp-feature-grid span{
    display:block;

    font-size:42px;

    color:transparent;

    background:
        linear-gradient(
            135deg,
            var(--dp-purple),
            var(--dp-blue)
        );

    -webkit-background-clip:text;
    background-clip:text;
}

.dp-feature-grid h3{
    margin:15px 0 7px;

    font-size:11px;
    letter-spacing:.5px;
}

.dp-feature-grid p{
    margin:0;

    color:var(--dp-muted);
    font-size:9px;
    line-height:1.6;
}


/* ===================== CTA ===================== */

.dp-cta{
    min-height:320px;

    padding:
        48px
        clamp(35px,8vw,120px);

    display:grid;
    grid-template-columns:.8fr 1.2fr;
    align-items:center;

    position:relative;
    overflow:hidden;

    color:#fff;

    background:
        radial-gradient(
            circle at 15% 55%,
            rgba(15,108,255,.45),
            transparent 28%
        ),
        linear-gradient(
            115deg,
            #071145,
            #281069 45%,
            #611099 75%,
            #071c71
        );
}

.dp-cta-player{
    font-size:180px;
    font-weight:1000;
    transform:rotate(-20deg);

    color:transparent;

    background:
        linear-gradient(
            135deg,
            #21a1ff,
            #fff,
            #a42ee0
        );

    -webkit-background-clip:text;
    background-clip:text;
}

.dp-cta>div:last-child{
    position:relative;
    z-index:2;
    max-width:640px;
}

.dp-cta small{
    color:#75aaff;
    font-size:17px;
    font-weight:1000;
    font-style:italic;
}

.dp-cta h2{
    margin:7px 0 12px;
    font-size:37px;
}

.dp-cta p{
    max-width:580px;

    color:#d9ddf4;
    font-size:11px;
    line-height:1.7;
}

.dp-cta>div>div{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:20px;
}


/* ===================== FOOTER ===================== */

.dp-footer{
    padding:
        52px
        clamp(30px,7vw,100px);

    display:grid;
    grid-template-columns:
        1.3fr
        repeat(3,.7fr);

    gap:45px;

    color:#c7cce1;
    background:#010716;
}

.dp-footer-brand p{
    max-width:240px;

    color:#8d94ac;
    font-size:9px;
    line-height:1.8;
}

.dp-footer>div:not(.dp-footer-brand){
    display:flex;
    flex-direction:column;
    gap:9px;
}

.dp-footer>div>b{
    margin-bottom:7px;
    color:#fff;
    font-size:9px;
    letter-spacing:1px;
}

.dp-footer button,
.dp-footer span{
    padding:0;
    border:0;
    background:transparent;

    color:#9ca3bb;
    text-align:left;
    font-size:8px;
}

.dp-footer button:hover{
    color:#fff;
}

.dp-copyright{
    grid-column:1/-1;

    margin-top:12px;
    padding-top:21px;

    border-top:1px solid #171d30;

    color:#747b95;
    font-size:8px;
}


/* ===================== BACK TO HOME ===================== */

.dp-auth-back{
    align-self:flex-start;

    margin-bottom:22px;
    padding:0;

    border:0;
    background:transparent;

    color:#7027d9;
    font-size:9px;
    font-weight:900;
}


/* ===================== RESPONSIVE ===================== */

@media (max-width:1050px){

    .dp-nav-links{
        display:none;
    }

    .dp-brand{
        flex:1;
    }

    .dp-hero{
        grid-template-columns:1fr .85fr;
    }

    .dp-orbit{
        width:390px;
    }

    .dp-news-grid{
        grid-template-columns:repeat(2,1fr);
    }
}


@media (max-width:760px){

    .dp-nav{
        height:67px;
        padding:0 17px;
    }

    .dp-brand{
        min-width:0;
    }

    .dp-brand img{
        width:44px;
        height:40px;
    }

    .dp-brand strong{
        font-size:17px;
    }

    .dp-brand small{
        font-size:6px;
        letter-spacing:4px;
    }

    .dp-login{
        display:none;
    }

    .dp-book-top{
        padding:10px 12px;
        font-size:8px;
    }

    .dp-hero{
        min-height:760px;
        display:block;
        padding:52px 23px 100px;
    }

    .dp-hero h1{
        font-size:53px;
        letter-spacing:-3px;
    }

    .dp-tagline{
        font-size:9px;
        letter-spacing:4px;
    }

    .dp-hero-copy>p{
        font-size:10px;
    }

    .dp-hero-art{
        min-height:290px;
        margin-top:20px;
    }

    .dp-paddle{
        width:120px;
        height:166px;
        border-width:6px;
    }

    .dp-paddle span{
        font-size:40px;
    }

    .dp-paddle i{
        width:33px;
        height:115px;
        top:151px;
        left:38px;
    }

    .dp-pickleball{
        width:82px;
        height:82px;
        left:15%;
        top:43%;

        padding:13px;

        font-size:13px;
        letter-spacing:9px;
        line-height:23px;
    }

    .dp-orbit{
        width:300px;
        height:100px;
    }

    .dp-orbit-two{
        width:250px;
    }

    .dp-stats{
        grid-template-columns:repeat(2,1fr);
        padding:25px 12px 35px;
    }

    .dp-stats article+article:before{
        display:none;
    }

    .dp-section{
        padding:48px 18px;
    }

    .dp-section>h2{
        font-size:20px;
        letter-spacing:3px;
    }

    .dp-social-grid,
    .dp-news-grid,
    .dp-feature-grid{
        grid-template-columns:1fr;
    }

    .dp-social-grid article{
        min-height:0;
    }

    .dp-cta{
        grid-template-columns:1fr;
        padding:44px 23px;
    }

    .dp-cta-player{
        display:none;
    }

    .dp-cta h2{
        font-size:28px;
    }

    .dp-footer{
        grid-template-columns:1fr 1fr;
        padding:40px 23px;
        gap:30px;
    }

    .dp-footer-brand{
        grid-column:1/-1;
    }
}


@media (max-width:430px){

    .dp-brand small{
        display:none;
    }

    .dp-hero h1{
        font-size:45px;
    }

    .dp-hero-buttons{
        display:grid;
        grid-template-columns:1fr;
        max-width:250px;
    }

    .dp-footer{
        grid-template-columns:1fr;
    }

    .dp-footer-brand,
    .dp-copyright{
        grid-column:auto;
    }
}



/* ============================================================
   DEWPOINT HERO V2 — TEXT + WATERMARK + LOGIN CARD
   ============================================================ */

.dp-hero-login{
    grid-template-columns:minmax(0,1.55fr) minmax(330px,.65fr);
    gap:55px;
}

.dp-hero-login .dp-hero-copy{
    min-height:430px;
    display:flex;
    flex-direction:column;
    justify-content:center;
}

.dp-watermark-logo{
    position:absolute;
    z-index:-1;
    right:-4%;
    top:45%;
    transform:translateY(-50%);
    font-size:330px;
    line-height:.75;
    font-weight:1000;
    font-style:italic;
    letter-spacing:-45px;
    color:rgba(94,66,211,.16);
    user-select:none;
    pointer-events:none;
}

.dp-hero-login .dp-hero-art{
    display:none!important;
}


/* LOGIN CARD */

.dp-login-card{
    width:100%;
    max-width:405px;
    justify-self:end;

    padding:30px 30px 27px;

    border:1px solid rgba(172,169,255,.55);
    border-radius:14px;

    color:#fff;

    background:
        linear-gradient(
            145deg,
            rgba(29,28,79,.86),
            rgba(19,22,62,.82)
        );

    box-shadow:
        0 30px 70px rgba(0,0,0,.25),
        inset 0 1px 0 rgba(255,255,255,.06);

    backdrop-filter:blur(18px);
}

.dp-login-card h2{
    margin:0 0 6px;
    font-size:25px;
    font-weight:900;
}

.dp-login-card>p{
    margin:0 0 24px;
    color:#cdd2ec;
    font-size:11px;
}

.dp-login-card form{
    display:flex;
    flex-direction:column;
    gap:15px;
}

.dp-login-card label{
    display:flex;
    flex-direction:column;
    gap:7px;
    font-size:10px;
    font-weight:800;
}

.dp-login-card input{
    width:100%;
    padding:12px 13px;

    color:#fff;
    background:rgba(4,9,35,.32);

    border:1px solid rgba(185,191,232,.28);
    border-radius:6px;

    font-size:11px;
    outline:none;
}

.dp-login-card input::placeholder{
    color:#8f96b7;
}

.dp-login-card input:focus{
    border-color:#7d55ff;
    box-shadow:0 0 0 3px rgba(116,69,255,.12);
}

.dp-login-submit{
    width:100%;
    margin-top:3px;
    padding:13px;

    border:0;
    border-radius:6px;

    color:#fff;

    background:
        linear-gradient(
            90deg,
            #8422f4,
            #106dff
        );

    font-size:10px;
    font-weight:1000;
}

.dp-login-submit:disabled{
    opacity:.65;
}

.dp-login-error{
    padding:9px 10px;

    border:1px solid rgba(255,111,120,.45);
    border-radius:6px;

    color:#ffd4d7;
    background:rgba(153,27,40,.18);

    font-size:9px;
}

.dp-login-or{
    display:flex;
    align-items:center;
    gap:12px;
    margin:20px 0;

    color:#a6acc7;
    font-size:9px;
}

.dp-login-or:before,
.dp-login-or:after{
    content:"";
    height:1px;
    flex:1;
    background:rgba(255,255,255,.16);
}

.dp-login-register{
    text-align:center;
    color:#cdd2e6;
    font-size:10px;
}

.dp-login-register button{
    border:0;
    padding:0;
    background:transparent;
    color:#36a4ff;
    font-size:10px;
}


/* GUEST INTRO */

.dp-guest-intro{
    max-width:1160px;
    margin:0 auto;
    padding:34px 35px;

    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;

    background:#fff;
}

.dp-guest-intro small{
    color:#6e2de5;
    letter-spacing:1.6px;
    font-size:8px;
    font-weight:1000;
}

.dp-guest-intro h2{
    margin:6px 0;
    font-size:24px;
}

.dp-guest-intro p{
    max-width:700px;
    margin:0;
    color:#74798c;
    line-height:1.6;
    font-size:10px;
}

.dp-guest-placeholder{
    min-height:100vh;
    padding:60px;
    background:#f6f7fc;
}

.dp-guest-placeholder h1{
    margin:25px 0 10px;
    font-size:32px;
}


/* TABLET */

@media(max-width:1000px){

    .dp-hero-login{
        grid-template-columns:1fr;
    }

    .dp-login-card{
        max-width:600px;
        justify-self:start;
    }

    .dp-watermark-logo{
        font-size:250px;
    }
}


/* MOBILE */

@media(max-width:760px){

    .dp-hero-login{
        min-height:auto;
        display:grid;
        padding-bottom:75px;
    }

    .dp-hero-login .dp-hero-copy{
        min-height:400px;
    }

    .dp-watermark-logo{
        right:-10%;
        top:46%;
        font-size:190px;
        letter-spacing:-25px;
    }

    .dp-login-card{
        width:100%;
        max-width:none;
        padding:24px 20px;
    }

    .dp-guest-intro{
        padding:30px 20px;
        flex-direction:column;
        align-items:flex-start;
    }

    .dp-guest-intro button{
        width:100%;
    }
}



/* ============================================================
   DEWPOINT GUEST COURT BOOKING
   Guest can browse/select. Login required at checkout.
   ============================================================ */

.dp-guest-booking-page{
    min-height:100vh;
    background:
        linear-gradient(180deg,#f7f8fc 0%,#eef1f8 100%);
    color:#111831;
}


/* TOP NAV */

.dp-guest-booking-nav{
    min-height:72px;
    padding:0 5vw;

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

    background:
        linear-gradient(
            105deg,
            #07122f,
            #171548 60%,
            #29135e
        );

    border-bottom:1px solid rgba(255,255,255,.08);
}

.dp-guest-booking-nav .dp-brand{
    color:#fff;
}

.dp-guest-login{
    min-width:105px;
    padding:10px 20px;

    border:1px solid rgba(164,150,255,.6);
    border-radius:7px;

    color:#fff;
    background:rgba(255,255,255,.06);

    font-size:10px;
    font-weight:900;
    letter-spacing:.6px;
}

.dp-guest-login:hover{
    background:rgba(255,255,255,.12);
}


/* PAGE HEADING */

.dp-guest-booking-head{
    padding:45px 5vw 35px;

    background:
        radial-gradient(
            circle at 80% 20%,
            rgba(109,53,238,.10),
            transparent 35%
        ),
        #fff;

    border-bottom:1px solid #e7e9f2;
}

.dp-guest-booking-head small{
    display:block;
    margin-bottom:8px;

    color:#6f38e9;

    font-size:9px;
    font-weight:1000;
    letter-spacing:1.7px;
}

.dp-guest-booking-head h1{
    margin:0;

    font-size:34px;
    line-height:1.1;
    font-weight:1000;
    letter-spacing:-1px;
}

.dp-guest-booking-head p{
    max-width:700px;

    margin:11px 0 0;

    color:#777e92;
    font-size:11px;
    line-height:1.65;
}


/* MAIN TWO-COLUMN LAYOUT */

.dp-guest-booking-layout{
    width:min(1440px,94vw);
    margin:34px auto 80px;

    display:grid;
    grid-template-columns:minmax(0,1fr) 340px;
    gap:24px;
    align-items:start;
}


/* COURT PANEL */

.dp-guest-court-panel{
    min-width:0;

    padding:26px;

    border:1px solid #e1e4ed;
    border-radius:15px;

    background:#fff;

    box-shadow:
        0 14px 40px rgba(34,40,78,.06);
}

.dp-guest-booking-controls{
    display:flex;
    align-items:flex-end;
    gap:16px;

    padding-bottom:22px;
    margin-bottom:22px;

    border-bottom:1px solid #eceef4;
}

.dp-guest-booking-controls label{
    display:flex;
    flex-direction:column;
    gap:8px;

    min-width:210px;

    color:#6b7081;

    font-size:9px;
    font-weight:900;
    letter-spacing:.5px;
}

.dp-guest-booking-controls select{
    min-height:43px;

    padding:0 13px;

    border:1px solid #d8dce8;
    border-radius:8px;

    color:#1e2540;
    background:#fff;

    font-size:11px;
    font-weight:700;

    outline:none;
}

.dp-guest-booking-controls select:focus{
    border-color:#7956ed;

    box-shadow:
        0 0 0 3px rgba(113,73,225,.10);
}


/* VENUE */

.dp-guest-venue-title{
    margin-bottom:18px;
}

.dp-guest-venue-title h2{
    margin:0 0 5px;

    font-size:21px;
    font-weight:1000;
}

.dp-guest-venue-title p{
    margin:0;

    color:#858a9b;
    font-size:10px;
}


/* LOADING / ERROR */

.dp-guest-loading{
    padding:40px;

    text-align:center;

    color:#73798d;
    font-size:11px;
}

.dp-guest-error{
    margin:0 0 18px;
    padding:12px 14px;

    border:1px solid #ffd0d4;
    border-radius:8px;

    color:#a72435;
    background:#fff4f5;

    font-size:10px;
}


/* SCHEDULE GRID */

.dp-guest-slot-scroll{
    width:100%;
    overflow-x:auto;

    border:1px solid #e5e7ef;
    border-radius:12px;
}

.dp-guest-slot-grid{
    display:grid;

    min-width:680px;

    background:#e5e7ef;

    gap:1px;
}

.dp-guest-grid-head{
    min-height:54px;

    padding:10px;

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

    color:#fff;

    background:
        linear-gradient(
            135deg,
            #151943,
            #2b1c65
        );

    text-align:center;

    font-size:10px;
    font-weight:1000;
}

.dp-guest-grid-head.time{
    background:#101630;
}

.dp-guest-time{
    min-height:68px;

    padding:10px 8px;

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

    background:#f8f9fc;
}

.dp-guest-time b{
    color:#242943;

    font-size:10px;
    font-weight:1000;
}

.dp-guest-time small{
    margin-top:2px;

    color:#9095a7;
    font-size:8px;
}


/* SLOT BUTTON */

.dp-guest-slot{
    min-height:68px;

    padding:9px 7px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:4px;

    border:0;

    color:#275d49;
    background:#effaf5;

    transition:
        transform .12s ease,
        background .12s ease,
        box-shadow .12s ease;
}

.dp-guest-slot:hover:not(:disabled){
    position:relative;
    z-index:2;

    background:#e3f7ef;

    box-shadow:
        inset 0 0 0 2px #50b98d;

    transform:scale(.98);
}

.dp-guest-slot b{
    font-size:9px;
    font-weight:1000;
}

.dp-guest-slot small{
    color:#588372;

    font-size:8px;
    font-weight:800;
}

.dp-guest-slot.selected{
    color:#fff;

    background:
        linear-gradient(
            135deg,
            #7736ed,
            #3158ec
        );

    box-shadow:
        inset 0 0 0 2px rgba(255,255,255,.25);
}

.dp-guest-slot.selected small{
    color:#eef0ff;
}

.dp-guest-slot.unavailable{
    cursor:not-allowed;

    color:#a2a6b2;
    background:#f2f3f6;

    opacity:.9;
}

.dp-guest-slot.unavailable small{
    color:#afb2bc;
}


/* BOOKING SUMMARY */

.dp-guest-summary{
    position:sticky;
    top:20px;

    padding:24px;

    border:1px solid #e0e2eb;
    border-radius:15px;

    background:#fff;

    box-shadow:
        0 15px 45px rgba(28,35,71,.09);
}

.dp-guest-summary>small{
    display:block;
    margin-bottom:6px;

    color:#7440e7;

    font-size:8px;
    font-weight:1000;
    letter-spacing:1.4px;
}

.dp-guest-summary h2{
    margin:0 0 20px;

    font-size:21px;
    font-weight:1000;
}

.dp-guest-summary-items{
    display:flex;
    flex-direction:column;
    gap:9px;

    margin-bottom:18px;
}

.dp-guest-summary-items article{
    padding:12px;

    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;

    border:1px solid #e8e9ef;
    border-radius:9px;

    background:#fafbfe;
}

.dp-guest-summary-items article>div{
    display:flex;
    flex-direction:column;
    gap:3px;
}

.dp-guest-summary-items b{
    color:#232943;

    font-size:10px;
    font-weight:1000;
}

.dp-guest-summary-items small{
    color:#8b90a0;

    font-size:8px;
}

.dp-guest-summary-items strong{
    color:#5330c9;

    font-size:10px;
    white-space:nowrap;
}

.dp-guest-empty{
    min-height:100px;

    padding:25px 15px;

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

    border:1px dashed #d8dae4;
    border-radius:9px;

    color:#9296a6;
    background:#fafbfc;

    text-align:center;
    font-size:9px;
    line-height:1.5;
}

.dp-guest-total{
    margin:17px 0;

    padding-top:17px;

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

    border-top:1px solid #e8eaf1;
}

.dp-guest-total span{
    color:#727788;

    font-size:9px;
    font-weight:900;
}

.dp-guest-total strong{
    color:#1a2040;

    font-size:23px;
    font-weight:1000;
}

.dp-guest-checkout{
    width:100%;

    min-height:46px;

    border-radius:8px;
}

.dp-guest-checkout:disabled{
    cursor:not-allowed;
    opacity:.42;
}

.dp-guest-login-note{
    margin:10px 0 0;

    color:#9296a6;

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


/* ============================================================
   RESPONSIVE
   ============================================================ */

@media(max-width:1050px){

    .dp-guest-booking-layout{
        grid-template-columns:1fr;
    }

    .dp-guest-summary{
        position:static;
    }
}


@media(max-width:760px){

    .dp-guest-booking-nav{
        padding:0 18px;
    }

    .dp-guest-booking-head{
        padding:32px 20px 27px;
    }

    .dp-guest-booking-head h1{
        font-size:27px;
    }

    .dp-guest-booking-layout{
        width:auto;
        margin:20px 14px 50px;
        gap:15px;
    }

    .dp-guest-court-panel{
        padding:16px;
        border-radius:11px;
    }

    .dp-guest-booking-controls{
        flex-direction:column;
        align-items:stretch;
    }

    .dp-guest-booking-controls label{
        width:100%;
        min-width:0;
    }

    .dp-guest-summary{
        padding:20px;
        border-radius:11px;
    }

    .dp-guest-slot-scroll{
        border-radius:8px;
    }
}



/* =========================================================
   DEWPOINT PLAYER HOME BOARD
   ========================================================= */

.dp-home-board{
    --dp-bg1:#020b24;
    --dp-bg2:#071948;
    --dp-bg3:#31106f;
    --dp-blue:#1b7bff;
    --dp-purple:#8237ff;
    --dp-pink:#d946ef;
    --dp-line:rgba(132,100,255,.22);
    --dp-softline:rgba(255,255,255,.08);
    --dp-text:#ffffff;
    --dp-muted:#c8cdea;
    --dp-panel:rgba(11,18,48,.78);
    --dp-panel2:rgba(9,15,42,.92);
    --dp-success:#29d66f;
    --dp-warning:#f6b93b;
    --dp-danger:#ff5c7a;
    --dp-gray:#d0d4df;
    background:
        radial-gradient(circle at 75% 18%, rgba(116,34,255,.30), transparent 28%),
        linear-gradient(90deg, #020817 0%, #03133f 48%, #26084d 100%);
    color:#fff;
    min-height:100vh;
}

.dp-nav-sticky{
    position:sticky;
    top:0;
    z-index:50;
    display:grid;
    grid-template-columns:auto 1fr auto;
    align-items:center;
    gap:28px;
    padding:14px 26px;
    background:rgba(2,7,24,.92);
    backdrop-filter:blur(14px);
    border-bottom:1px solid rgba(120,90,255,.18);
    box-shadow:0 10px 35px rgba(0,0,0,.22);
}

.dp-brand{
    display:flex;
    align-items:center;
    gap:12px;
    background:none;
    border:none;
    color:#fff;
    padding:0;
}

.dp-brand img{
    width:66px;
    height:66px;
    object-fit:contain;
    filter:drop-shadow(0 8px 20px rgba(99,82,255,.28));
}

.dp-brand span{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    line-height:1;
}

.dp-brand strong{
    font-size:17px;
    font-weight:1000;
    letter-spacing:.8px;
}

.dp-brand small{
    font-size:11px;
    letter-spacing:4px;
    opacity:.92;
    margin-top:5px;
}

.dp-nav-links{
    display:flex;
    justify-content:center;
    gap:18px;
    flex-wrap:wrap;
}

.dp-nav-links button,
.dp-login-link{
    background:none;
    border:none;
    color:#fff;
    font-size:13px;
    font-weight:800;
    letter-spacing:.9px;
    padding:8px 12px;
    opacity:.92;
}

.dp-nav-actions{
    display:flex;
    align-items:center;
    gap:14px;
}

.dp-book-now{
    border:none;
    color:#fff;
    font-weight:900;
    font-size:13px;
    letter-spacing:.8px;
    border-radius:12px;
    padding:15px 24px;
    background:linear-gradient(90deg,var(--dp-purple),var(--dp-blue));
    box-shadow:0 18px 30px rgba(34,98,255,.25);
}

.dp-hero-v3{
    display:grid;
    grid-template-columns:1.1fr .8fr .9fr;
    gap:34px;
    align-items:center;
    padding:26px 38px 18px;
    min-height:620px;
    position:relative;
}

.dp-hero-copy{
    position:relative;
    padding:30px 10px 20px 10px;
}

.dp-hero-dots{
    width:220px;
    height:86px;
    background-image:radial-gradient(rgba(58,120,255,.45) 1.1px, transparent 1.1px);
    background-size:18px 18px;
    margin-bottom:18px;
    opacity:.95;
}

.dp-hero-tag{
    display:inline-flex;
    border:1px solid rgba(120,149,255,.34);
    background:rgba(12,20,58,.55);
    color:#dce0f5;
    border-radius:10px;
    padding:11px 18px;
    font-size:13px;
    font-weight:800;
    letter-spacing:2px;
    margin-bottom:20px;
}

.dp-watermark-logo{
    position:absolute;
    right:-4%;
    top:48%;
    transform:translateY(-50%);
    font-style:italic;
    font-size:290px;
    font-weight:1000;
    line-height:.8;
    color:rgba(110,97,255,.13);
    letter-spacing:-28px;
    z-index:0;
    pointer-events:none;
    user-select:none;
}

.dp-hero-copy h1{
    position:relative;
    z-index:1;
    display:flex;
    flex-direction:column;
    margin:0 0 14px;
    line-height:.9;
}

.dp-hero-copy h1 .line1{
    font-size:98px;
    font-weight:1000;
    font-style:italic;
    letter-spacing:-3px;
    color:#fff;
}

.dp-hero-copy h1 .line2{
    font-size:86px;
    font-weight:1000;
    font-style:italic;
    letter-spacing:-3px;
    background:linear-gradient(90deg,#1d7dff 0%, #7b39ff 60%, #e746e7 100%);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
}

.dp-hero-copy h3{
    margin:0 0 22px;
    font-size:22px;
    font-weight:900;
    letter-spacing:7px;
    color:#fff;
}

.dp-hero-copy p{
    margin:0 0 28px;
    max-width:520px;
    color:#d0d5ee;
    font-size:17px;
    line-height:1.6;
}

.dp-hero-buttons{
    display:flex;
    gap:16px;
    flex-wrap:wrap;
    margin-bottom:24px;
}

.dp-hero-buttons .primary,
.dp-hero-buttons .secondary{
    border:none;
    border-radius:12px;
    padding:17px 24px;
    color:#fff;
    font-size:16px;
    font-weight:900;
    letter-spacing:.5px;
}

.dp-hero-buttons .primary{
    background:linear-gradient(90deg,var(--dp-purple),#bb42ff);
}

.dp-hero-buttons .secondary{
    background:linear-gradient(90deg,#236dff,#2ea4ff);
}

.dp-hero-points{
    display:flex;
    gap:24px;
    flex-wrap:wrap;
    color:#d8dcf3;
    font-size:14px;
    font-weight:700;
}

.dp-hero-login-wrap{
    display:contents;
}

.dp-login-card{
    width:100%;
    max-width:460px;
    align-self:center;
    background:linear-gradient(145deg,rgba(29,27,77,.90),rgba(16,20,59,.84));
    border:1px solid rgba(184,165,255,.34);
    border-radius:18px;
    padding:34px 34px 28px;
    box-shadow:0 25px 80px rgba(0,0,0,.35);
    backdrop-filter:blur(14px);
}

.dp-login-card h2{
    margin:0 0 8px;
    font-size:28px;
    font-weight:1000;
    color:#fff;
}

.dp-login-card > p{
    margin:0 0 24px;
    color:#cfd5f0;
    font-size:15px;
}

.dp-login-card form{
    display:flex;
    flex-direction:column;
    gap:16px;
}

.dp-login-card label{
    display:flex;
    flex-direction:column;
    gap:8px;
    color:#fff;
    font-size:14px;
    font-weight:800;
}

.dp-login-card input{
    width:100%;
    padding:15px 16px;
    background:rgba(4,10,36,.40);
    border:1px solid rgba(160,170,229,.24);
    border-radius:10px;
    color:#fff;
    font-size:15px;
    outline:none;
}

.dp-login-card input::placeholder{
    color:#92a0ca;
}

.dp-login-card input:focus{
    border-color:#8555ff;
    box-shadow:0 0 0 3px rgba(116,74,255,.18);
}

.dp-login-error{
    background:rgba(255,87,122,.14);
    border:1px solid rgba(255,87,122,.26);
    color:#ffd3dc;
    padding:11px 13px;
    border-radius:10px;
    font-size:13px;
}

.dp-login-submit{
    border:none;
    border-radius:12px;
    padding:16px 18px;
    color:#fff;
    font-size:17px;
    font-weight:1000;
    background:linear-gradient(90deg,#9c35ff,#1f94ff);
    margin-top:4px;
}

.dp-login-or{
    display:flex;
    align-items:center;
    gap:14px;
    margin:20px 0 14px;
    color:#d2d8ef;
    font-size:13px;
}

.dp-login-or span{
    flex:1;
    height:1px;
    background:rgba(255,255,255,.12);
}

.dp-login-foot{
    text-align:center;
    color:#d2d8ef;
    font-size:14px;
}

.dp-inline-link{
    background:none;
    border:none;
    color:#2ea4ff;
    font-weight:900;
    padding:0;
}

.dp-hero-brandart{
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:440px;
}

.dp-hero-brandart img{
    width:min(100%,480px);
    max-height:460px;
    object-fit:contain;
    filter:drop-shadow(0 28px 55px rgba(24,104,255,.20));
}

.dp-booking-board-shell{
    margin:10px 18px 0;
    padding:10px 20px 26px;
    border:1px solid rgba(131,97,255,.18);
    border-radius:18px;
    background:rgba(6,13,35,.62);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}

.dp-booking-board-title{
    margin:0 0 18px;
    text-align:center;
    color:#fff;
    font-size:28px;
    font-weight:1000;
    letter-spacing:.7px;
}

.dp-guest-booking-embedded{
    color:#fff;
}

.dp-guest-toolbar{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:16px;
    flex-wrap:wrap;
    margin-bottom:18px;
}

.dp-guest-venue{
    display:flex;
    align-items:center;
    gap:10px;
    font-size:13px;
    font-weight:800;
}

.dp-guest-venue select{
    padding:11px 12px;
    border-radius:10px;
    border:1px solid rgba(255,255,255,.14);
    background:rgba(6,15,38,.72);
    color:#fff;
}

.dp-guest-note{
    color:#8b75ff;
    font-size:13px;
    font-weight:1000;
    letter-spacing:1.5px;
}

.dp-date-strip-wrap{
    display:grid;
    grid-template-columns:56px 1fr 56px;
    gap:14px;
    align-items:center;
    margin-bottom:14px;
}

.dp-date-arrow{
    width:56px;
    height:56px;
    border-radius:16px;
    border:1px solid rgba(255,255,255,.10);
    background:rgba(10,20,50,.84);
    color:#fff;
    font-size:28px;
}

.dp-date-strip{
    display:flex;
    gap:12px;
    overflow-x:auto;
    padding-bottom:4px;
    scrollbar-width:none;
}

.dp-date-strip::-webkit-scrollbar{
    display:none;
}

.dp-date-strip button{
    min-width:116px;
    padding:16px 14px;
    border-radius:16px;
    border:1px solid rgba(255,255,255,.10);
    background:rgba(10,20,50,.82);
    color:#fff;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:6px;
}

.dp-date-strip button.active{
    border-color:#9159ff;
    box-shadow:inset 0 0 0 1px rgba(145,89,255,.4);
}

.dp-date-strip button small{
    font-size:11px;
    opacity:.82;
}

.dp-date-strip button b{
    font-size:24px;
    line-height:1;
}

.dp-date-strip button span{
    font-size:14px;
    opacity:.88;
}

.dp-legend{
    display:flex;
    gap:18px;
    flex-wrap:wrap;
    margin:14px 0 24px;
    color:#d4daf2;
    font-size:14px;
}

.dp-legend span{
    display:flex;
    align-items:center;
    gap:8px;
}

.dp-legend i{
    width:12px;
    height:12px;
    border-radius:999px;
    display:block;
}

.dp-legend i.available{background:#41d96b;}
.dp-legend i.selected{background:#2ea4ff;}
.dp-legend i.hold{background:#f6b93b;}
.dp-legend i.booked{background:#ff607a;}
.dp-legend i.blocked{background:#d3d8e2;}

.dp-court-grid{
    display:grid;
    grid-template-columns:170px repeat(4,minmax(210px,1fr));
    gap:16px;
    align-items:start;
}

.dp-grid-head{
    display:grid;
    gap:12px;
}

.dp-grid-head > b{
    text-align:center;
    font-size:16px;
    letter-spacing:1px;
}

.dp-time-col > b{
    text-align:left;
}

.dp-time-cell{
    min-height:62px;
    display:flex;
    align-items:center;
    color:#fff;
    font-size:15px;
    font-weight:700;
    opacity:.95;
}

.dp-slot-card{
    min-height:62px;
    padding:10px 10px;
    border-radius:14px;
    border:1px solid rgba(78,199,101,.48);
    background:linear-gradient(180deg, rgba(7,28,25,.65), rgba(5,22,31,.82));
    color:#4fe07a;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:5px;
    font-weight:900;
}

.dp-slot-card small{
    color:#fff;
    font-size:13px;
    font-weight:700;
}

.dp-slot-card.selected{
    border-color:#2ea4ff;
    background:linear-gradient(180deg, rgba(21,52,115,.76), rgba(12,34,84,.88));
    color:#71b6ff;
}

.dp-slot-card.disabled{
    border-color:rgba(255,255,255,.08);
    background:rgba(94,98,120,.18);
    color:#bfc6d2;
}

.dp-slot-card.booked{
    border-color:#ff607a;
}

.dp-guest-summary{
    margin-top:28px;
    border:1px solid rgba(255,255,255,.08);
    background:rgba(10,18,42,.74);
    border-radius:16px;
    padding:20px 22px;
    display:flex;
    justify-content:space-between;
    gap:18px;
    flex-wrap:wrap;
}

.dp-guest-summary h3{
    margin:0 0 8px;
    font-size:22px;
}

.dp-guest-summary p{
    margin:0;
    color:#d4daf0;
    font-size:14px;
    line-height:1.6;
}

.dp-picked-list{
    margin:14px 0 0;
    padding-left:18px;
    color:#fff;
    line-height:1.7;
}

.dp-guest-summary-actions{
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:flex-end;
    gap:14px;
}

.dp-picked-total{
    font-size:20px;
    font-weight:1000;
    color:#fff;
}

.dp-proceed-checkout{
    border:none;
    border-radius:12px;
    padding:15px 24px;
    color:#fff;
    font-weight:1000;
    background:linear-gradient(90deg,#8e35ff,#268fff);
}

.dp-mini-features{
    margin:22px 18px 0;
    padding:0 0 28px;
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:14px;
}

.dp-mini-features > div{
    background:rgba(10,18,42,.58);
    border:1px solid rgba(255,255,255,.06);
    border-radius:14px;
    padding:16px 18px;
    text-align:center;
    color:#d7ddf4;
    font-size:14px;
    font-weight:800;
}

.dp-loading,
.dp-guest-error{
    padding:18px 20px;
    border-radius:14px;
    background:rgba(17,27,58,.8);
}

.dp-guest-error{
    margin-bottom:12px;
    color:#ffd3dc;
    border:1px solid rgba(255,80,110,.22);
}

@media (max-width:1400px){
    .dp-hero-v3{
        grid-template-columns:1fr 420px;
    }
    .dp-hero-brandart{
        grid-column:2;
        grid-row:1 / span 2;
    }
    .dp-login-card{
        max-width:420px;
    }
    .dp-court-grid{
        grid-template-columns:160px repeat(4,minmax(180px,1fr));
    }
}

@media (max-width:1180px){
    .dp-nav-sticky{
        grid-template-columns:1fr;
        justify-items:center;
    }
    .dp-hero-v3{
        grid-template-columns:1fr;
    }
    .dp-hero-brandart{
        order:3;
        min-height:260px;
    }
    .dp-login-card{
        max-width:100%;
    }
    .dp-court-grid{
        overflow-x:auto;
        display:flex;
        gap:14px;
    }
    .dp-grid-head{
        min-width:220px;
    }
    .dp-time-col{
        min-width:170px;
    }
    .dp-mini-features{
        grid-template-columns:repeat(2,1fr);
    }
}

@media (max-width:760px){
    .dp-hero-v3{
        padding:20px 16px 16px;
        gap:20px;
    }
    .dp-booking-board-shell{
        margin:10px 10px 0;
        padding:12px;
    }
    .dp-hero-copy h1 .line1{
        font-size:62px;
    }
    .dp-hero-copy h1 .line2{
        font-size:56px;
    }
    .dp-hero-copy h3{
        font-size:16px;
        letter-spacing:4px;
    }
    .dp-watermark-logo{
        font-size:180px;
        right:-10px;
    }
    .dp-hero-buttons{
        flex-direction:column;
        align-items:stretch;
    }
    .dp-date-strip-wrap{
        grid-template-columns:46px 1fr 46px;
    }
    .dp-date-arrow{
        width:46px;
        height:46px;
    }
    .dp-mini-features{
        grid-template-columns:1fr;
    }
    .dp-guest-summary-actions{
        width:100%;
        align-items:stretch;
    }
    .dp-proceed-checkout{
        width:100%;
    }
}


/* ============================================================
   DEWPOINT FINAL PLAYER BOARD
   Landing page = guest + registered player booking board
   ============================================================ */

.dp-final-board{
    min-height:100vh;
    color:#fff;

    background:
        radial-gradient(
            circle at 78% 17%,
            rgba(113,41,239,.28),
            transparent 31%
        ),
        radial-gradient(
            circle at 47% 30%,
            rgba(28,75,210,.25),
            transparent 34%
        ),
        linear-gradient(
            110deg,
            #02091e 0%,
            #061438 47%,
            #2b0754 100%
        );
}


/* ============================================================
   FROZEN TOP BAR
   ============================================================ */

.dp-final-nav{
    position:sticky !important;
    top:0;
    z-index:1000;

    min-height:74px;
    padding:0 4vw;

    display:grid;
    grid-template-columns:220px 1fr 220px;
    align-items:center;
    gap:25px;

    background:rgba(2,8,27,.96);

    border-bottom:
        1px solid rgba(102,76,227,.30);

    box-shadow:
        0 8px 30px rgba(0,0,0,.28);

    backdrop-filter:blur(18px);
}


/* DEWPOINT WORD LOGO */

.dp-final-nav .dp-brand{
    display:flex;
    align-items:center;

    border:0;
    padding:0;

    color:#fff;
    background:transparent;
}

.dp-final-nav .dp-brand span{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
}

.dp-final-nav .dp-brand strong{
    font-size:20px;
    line-height:1;

    font-style:italic;
    font-weight:1000;
    letter-spacing:.5px;
}

.dp-final-nav .dp-brand small{
    margin-top:5px;

    font-size:8px;
    font-weight:900;
    letter-spacing:5px;
}


/* CENTER NAV */

.dp-final-nav .dp-nav-links{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:20px;
}

.dp-final-nav .dp-nav-links button{
    position:relative;

    border:0;
    padding:10px 12px;

    color:#fff;
    background:transparent;

    font-size:10px;
    font-weight:1000;
    letter-spacing:.8px;

    opacity:.90;
}

.dp-final-nav .dp-nav-links button:hover{
    opacity:1;
}

.dp-final-nav .dp-nav-links button:hover:after{
    content:"";

    position:absolute;
    left:12px;
    right:12px;
    bottom:2px;

    height:2px;

    border-radius:3px;

    background:
        linear-gradient(
            90deg,
            #8b35f6,
            #237cff
        );
}


/* RIGHT NAV */

.dp-final-nav .dp-nav-actions{
    display:flex;
    justify-content:flex-end;
    align-items:center;
    gap:13px;
}

.dp-final-nav .dp-login{
    border:0;
    padding:10px 8px;

    color:#fff;
    background:transparent;

    font-size:10px;
    font-weight:1000;
    letter-spacing:.8px;
}

.dp-final-nav .dp-book-top{
    border:0;
    border-radius:8px;

    padding:13px 19px;

    color:#fff;

    background:
        linear-gradient(
            90deg,
            #812df3,
            #147bff
        );

    box-shadow:
        0 12px 30px rgba(38,96,255,.24);

    font-size:9px;
    font-weight:1000;
}

.dp-player-welcome{
    color:#dfe3f7;

    font-size:10px;
    font-weight:800;
}


/* ============================================================
   HERO
   ============================================================ */

.dp-final-hero{
    position:relative;

    min-height:510px;

    padding:
        42px
        max(5vw,40px)
        42px;

    display:grid;
    grid-template-columns:minmax(0,1.15fr) minmax(360px,.85fr);
    align-items:center;
    gap:40px;

    overflow:hidden;

    border-bottom:
        1px solid rgba(255,255,255,.05);
}


/* LEFT HERO */

.dp-final-copy{
    position:relative;

    z-index:2;

    max-width:780px;
}

.dp-final-copy .dp-grid-dots{
    position:absolute;

    top:-14px;
    left:-29px;

    width:280px;
    height:120px;

    opacity:.55;

    background-image:
        radial-gradient(
            rgba(51,110,255,.70) 1.2px,
            transparent 1.2px
        );

    background-size:18px 18px;

    pointer-events:none;
}


.dp-final-copy .dp-eyebrow{
    position:relative;
    z-index:2;

    display:inline-block;

    margin-bottom:20px;

    padding:9px 15px;

    border:
        1px solid rgba(104,126,230,.40);

    border-radius:7px;

    color:#cbd5ff;

    background:
        rgba(8,17,52,.54);

    font-size:9px;
    font-weight:1000;
    letter-spacing:2px;
}


/* GIANT FADED DP BEHIND WORDING */

.dp-final-watermark{
    position:absolute;

    z-index:0;

    left:310px;
    top:47%;

    transform:
        translateY(-50%)
        skewX(-9deg);

    color:
        rgba(87,70,209,.12);

    font-size:270px;
    line-height:.75;

    font-style:italic;
    font-weight:1000;

    letter-spacing:-35px;

    pointer-events:none;
    user-select:none;
}


/* MAIN TITLE */

.dp-final-copy h1{
    position:relative;

    z-index:2;

    margin:0 0 15px;

    display:flex;
    flex-direction:column;

    line-height:.82;
}

.dp-final-copy h1 span{
    color:#fff;

    font-size:76px;

    font-style:italic;
    font-weight:1000;

    letter-spacing:-3px;
}

.dp-final-copy h1 em{
    margin-top:9px;

    font-size:69px;

    font-style:italic;
    font-weight:1000;

    letter-spacing:-3px;

    background:
        linear-gradient(
            90deg,
            #1679fa 0%,
            #7139ef 57%,
            #dc41d4 100%
        );

    -webkit-background-clip:text;
    background-clip:text;

    color:transparent;
}


.dp-final-copy .dp-tagline{
    position:relative;
    z-index:2;

    margin-top:27px;

    color:#fff;

    font-size:14px;
    font-weight:1000;

    letter-spacing:7px;
}


.dp-final-copy>p{
    position:relative;
    z-index:2;

    max-width:600px;

    margin:24px 0;

    color:#d5dbf0;

    font-size:13px;
    line-height:1.65;
}


/* HERO BUTTONS */

.dp-final-copy .dp-hero-buttons{
    position:relative;

    z-index:2;

    display:flex;
    align-items:center;
    gap:12px;

    margin-top:24px;
}

.dp-final-copy .dp-primary,
.dp-final-copy .dp-secondary{
    border:0;

    min-height:47px;

    padding:0 21px;

    border-radius:8px;

    color:#fff;

    font-size:10px;
    font-weight:1000;
}

.dp-final-copy .dp-primary{
    background:
        linear-gradient(
            90deg,
            #8526ed,
            #b73eed
        );
}

.dp-final-copy .dp-secondary{
    background:
        linear-gradient(
            90deg,
            #1779ff,
            #279cff
        );
}


/* PERKS */

.dp-final-copy .dp-hero-perks{
    position:relative;
    z-index:2;

    margin-top:23px;

    display:flex;
    gap:20px;
    flex-wrap:wrap;

    color:#d7dcef;

    font-size:9px;
    font-weight:800;
}


/* ============================================================
   RIGHT HERO GRAPHIC
   no login card here
   ============================================================ */

.dp-final-art{
    position:relative;

    min-height:380px;

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

.dp-final-art:before,
.dp-final-art:after{
    content:"";

    position:absolute;

    border-radius:50%;

    border:
        6px solid rgba(102,57,228,.30);
}

.dp-final-art:before{
    width:340px;
    height:340px;

    transform:
        rotate(-18deg)
        scaleY(.55);
}

.dp-final-art:after{
    width:410px;
    height:240px;

    border-color:
        rgba(31,116,255,.21);

    transform:
        rotate(-22deg);
}

.dp-final-artmark{
    position:relative;
    z-index:2;

    width:260px;
    height:260px;

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

    border-radius:48% 52% 47% 53%;

    color:#fff;

    background:
        linear-gradient(
            145deg,
            rgba(250,250,255,.98),
            rgba(218,222,255,.90)
        );

    box-shadow:
        0 0 0 10px rgba(24,47,140,.70),
        0 0 0 16px rgba(103,45,211,.78),
        0 35px 90px rgba(26,62,237,.36);

    transform:
        rotate(24deg);

    font-size:85px;
    font-style:italic;
    font-weight:1000;

    letter-spacing:-16px;

    background-clip:padding-box;
    -webkit-text-fill-color:#5434c7;
}


/* ============================================================
   BOOKING SECTION DIRECTLY BELOW HERO
   ============================================================ */

.dp-home-booking{
    scroll-margin-top:85px;

    margin:0;

    padding:
        28px
        max(3vw,22px)
        55px;

    color:#10152e;

    background:
        linear-gradient(
            180deg,
            #f9fafe,
            #f2f4fa
        );
}


/* BOOKING TITLE */

.dp-home-booking-title{
    margin:
        0 auto 22px;

    text-align:center;
}

.dp-home-booking-title small{
    display:block;

    margin-bottom:6px;

    color:#6534dc;

    font-size:8px;
    font-weight:1000;
    letter-spacing:1.5px;
}

.dp-home-booking-title h2{
    margin:0;

    color:#161c35;

    font-size:27px;
    font-weight:1000;
}

.dp-home-booking-title p{
    margin:8px auto 0;

    max-width:720px;

    color:#74798d;

    font-size:10px;
    line-height:1.5;
}


/* existing guest booking container */

.dp-home-booking .dp-guest-booking-page{
    min-height:auto;

    color:#151b34;

    background:transparent;
}


/* remove duplicate guest page navigation */

.dp-home-booking .dp-guest-booking-nav,
.dp-home-booking .dp-guest-booking-head{
    display:none !important;
}


/* BOOKING LAYOUT */

.dp-home-booking .dp-guest-booking-layout{
    width:min(1500px,100%);

    margin:0 auto;

    grid-template-columns:minmax(0,1fr) 330px;

    gap:22px;
}


/* main grid */

.dp-home-booking .dp-guest-court-panel{
    border:
        1px solid #e0e3ee;

    border-radius:14px;

    background:#fff;

    box-shadow:
        0 15px 42px rgba(30,38,77,.07);
}


/* booking date controls */

.dp-home-booking .dp-guest-booking-controls select{
    background:#fff;
}


/* SLOT TABLE */

.dp-home-booking .dp-guest-slot-scroll{
    border:
        1px solid #e1e4ec;

    border-radius:10px;

    background:#fff;
}

.dp-home-booking .dp-guest-grid-head{
    color:#1e2744;

    background:#f3f5fa;

    border-bottom:
        1px solid #e2e5ed;
}

.dp-home-booking .dp-guest-grid-head.time{
    color:#1e2744;

    background:#f3f5fa;
}


/* TIME */

.dp-home-booking .dp-guest-time{
    background:#fafbfc;
}


/* AVAILABLE */

.dp-home-booking .dp-guest-slot{
    color:#0e8844;

    background:#edf9f1;
}

.dp-home-booking .dp-guest-slot:hover:not(:disabled){
    background:#ddf5e6;

    box-shadow:
        inset 0 0 0 2px #3db76d;
}


/* SELECTED */

.dp-home-booking .dp-guest-slot.selected{
    color:#fff;

    background:
        linear-gradient(
            135deg,
            #7531e6,
            #2375ee
        );
}


/* UNAVAILABLE */

.dp-home-booking .dp-guest-slot.unavailable{
    color:#a1a5b3;

    background:#f0f1f4;
}


/* SUMMARY */

.dp-home-booking .dp-guest-summary{
    top:95px;

    border:
        1px solid #e0e3ec;

    color:#1d2341;

    background:#fff;
}

.dp-home-booking .dp-guest-summary h2{
    color:#1a203b;
}

.dp-home-booking .dp-guest-total strong{
    color:#191f3d;
}


/* ============================================================
   SMALL FEATURE STRIP
   ============================================================ */

.dp-final-feature-strip{
    padding:
        0 max(3vw,22px) 40px;

    display:grid;
    grid-template-columns:repeat(4,1fr);

    gap:13px;

    background:#f2f4fa;
}

.dp-final-feature-strip>div{
    padding:18px;

    border:
        1px solid #e0e3ec;

    border-radius:11px;

    color:#424963;

    background:#fff;

    text-align:center;

    font-size:10px;
    font-weight:900;
}


/* ============================================================
   CENTER LOGIN MODAL — NAMI STYLE
   ============================================================ */

.dp-login-modal-backdrop{
    position:fixed;

    z-index:5000;

    inset:0;

    padding:25px;

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

    background:
        rgba(1,6,22,.65);

    backdrop-filter:
        blur(7px);
}


.dp-login-modal{
    position:relative;

    width:min(510px,94vw);

    padding:
        38px 38px 30px;

    border:
        1px solid #d7dce8;

    border-radius:14px;

    color:#0c1734;

    background:#fff;

    box-shadow:
        0 30px 100px
        rgba(0,0,0,.36);
}


.dp-login-close{
    position:absolute;

    right:18px;
    top:13px;

    width:35px;
    height:35px;

    border:0;

    color:#5f6678;
    background:transparent;

    font-size:28px;
    font-weight:300;
}


.dp-login-modal-head{
    text-align:center;

    margin-bottom:25px;
}


.dp-login-modal-logo{
    display:flex;
    flex-direction:column;

    align-items:center;

    margin-bottom:18px;
}


.dp-login-modal-logo strong{
    font-size:25px;

    font-style:italic;
    font-weight:1000;

    color:#131d4f;
}


.dp-login-modal-logo small{
    margin-top:4px;

    font-size:8px;

    font-weight:900;

    letter-spacing:5px;

    color:#454e71;
}


.dp-login-modal-head h2{
    margin:0;

    color:#0b1736;

    font-size:28px;

    font-weight:1000;
}


.dp-login-modal-head p{
    margin:
        7px 0 0;

    color:#747a8b;

    font-size:13px;
}


/* LOGIN FORM */

.dp-login-modal form{
    display:flex;
    flex-direction:column;

    gap:17px;
}


.dp-login-modal label{
    display:flex;
    flex-direction:column;

    gap:7px;

    color:#14203e;

    font-size:12px;

    font-weight:800;
}


.dp-login-modal input{
    min-height:50px;

    padding:
        0 15px;

    border:
        1px solid #ccd2df;

    border-radius:9px;

    color:#17213e;
    background:#fff;

    font-size:13px;

    outline:none;
}


.dp-login-modal input:focus{
    border-color:#6b4ee2;

    box-shadow:
        0 0 0 3px
        rgba(97,67,221,.10);
}


.dp-login-modal input::placeholder{
    color:#abb2c2;
}


.dp-login-modal .dp-login-submit{
    min-height:52px;

    margin-top:2px;

    border:0;

    border-radius:28px;

    color:#fff;

    background:
        linear-gradient(
            90deg,
            #6131dc,
            #1b75f3
        );

    font-size:13px;

    font-weight:1000;
}


.dp-login-modal-divider{
    display:flex;
    align-items:center;

    gap:13px;

    margin:
        21px 0;

    color:#8a90a1;

    font-size:10px;
}


.dp-login-modal-divider:before,
.dp-login-modal-divider:after{
    content:"";

    flex:1;

    height:1px;

    background:#dde0e8;
}


.dp-login-modal-register{
    text-align:center;

    color:#72788c;

    font-size:12px;
}


.dp-login-modal-register button{
    border:0;
    padding:0;

    color:#1933a1;

    background:transparent;

    font-size:12px;

    font-weight:1000;
}


.dp-login-modal-note{
    display:block;

    margin-top:23px;

    padding-top:16px;

    border-top:
        1px solid #eceef3;

    color:#9297a5;

    text-align:center;

    font-size:9px;
}


/* ============================================================
   RESPONSIVE
   ============================================================ */

@media(max-width:1050px){

    .dp-final-nav{
        grid-template-columns:auto 1fr auto;
    }

    .dp-final-nav .dp-nav-links{
        gap:5px;
    }

    .dp-final-hero{
        grid-template-columns:1fr;
    }

    .dp-final-art{
        display:none;
    }

    .dp-final-copy{
        max-width:820px;
    }

    .dp-home-booking .dp-guest-booking-layout{
        grid-template-columns:1fr;
    }

    .dp-home-booking .dp-guest-summary{
        position:static;
    }
}


@media(max-width:760px){

    .dp-final-nav{
        min-height:64px;

        padding:
            10px 14px;

        grid-template-columns:1fr auto;
    }

    .dp-final-nav .dp-nav-links{
        display:none;
    }

    .dp-final-nav .dp-brand strong{
        font-size:17px;
    }

    .dp-final-nav .dp-brand small{
        font-size:6px;
        letter-spacing:4px;
    }

    .dp-final-nav .dp-book-top{
        padding:
            11px 12px;
    }

    .dp-final-hero{
        min-height:auto;

        padding:
            36px 20px
            42px;
    }

    .dp-final-copy h1 span{
        font-size:54px;
    }

    .dp-final-copy h1 em{
        font-size:49px;
    }

    .dp-final-watermark{
        left:140px;

        font-size:180px;
    }

    .dp-final-copy .dp-tagline{
        font-size:11px;

        letter-spacing:4px;
    }

    .dp-final-copy>p{
        font-size:11px;
    }

    .dp-final-copy .dp-hero-buttons{
        flex-direction:column;

        align-items:stretch;
    }

    .dp-final-copy .dp-primary,
    .dp-final-copy .dp-secondary{
        width:100%;
    }

    .dp-home-booking{
        padding:
            25px 12px
            42px;
    }

    .dp-home-booking-title h2{
        font-size:22px;
    }

    .dp-final-feature-strip{
        padding:
            0 12px 30px;

        grid-template-columns:
            repeat(2,1fr);
    }

    .dp-login-modal{
        padding:
            35px 20px
            25px;
    }
}



/* ============================================================
   DEWPOINT — GUARANTEED FIXED TOP NAV
   ============================================================ */

.dp-final-nav{
    position:fixed !important;

    top:0 !important;
    left:0 !important;
    right:0 !important;

    width:100% !important;

    z-index:9999 !important;
}

.dp-final-board{
    padding-top:74px !important;
}

/* account for anchor scrolling underneath fixed nav */
.dp-home-booking,
#dp-final-features{
    scroll-margin-top:90px !important;
}

@media(max-width:760px){

    .dp-final-board{
        padding-top:64px !important;
    }

    .dp-home-booking,
    #dp-final-features{
        scroll-margin-top:78px !important;
    }
}



/* ============================================================
   DEWPOINT — PICKLE MANIA STYLE COURT BOOKING
   ============================================================ */

.dp-home-booking{
    position:relative;
    overflow:visible !important;
}


/* Main booking area */

.dp-pm-booking{
    position:relative;
    width:min(1450px,100%);
    margin:0 auto;
}

.dp-tap-booking-main{
    border:1px solid #e2e5ef;
    border-radius:18px;
    padding:22px;

    background:#fff;

    box-shadow:
        0 14px 40px
        rgba(32,40,78,.08);
}


/* ============================================================
   DATE < > STRIP
   ============================================================ */

.dp-pm-booking .swipe-date-shell{
    display:grid;
    grid-template-columns:48px minmax(0,1fr) 48px;
    gap:10px;
    align-items:center;

    margin-bottom:13px;
}

.dp-pm-booking .desktop-date-arrow{
    width:46px;
    height:60px;

    border:1px solid #dfe3ed;
    border-radius:12px;

    color:#313a5c;
    background:#fff;

    font-size:28px;
    font-weight:700;

    cursor:pointer;

    box-shadow:
        0 5px 15px
        rgba(31,38,72,.05);
}

.dp-pm-booking .desktop-date-arrow:hover{
    border-color:#7c5ee5;
    color:#6b42d7;
}


.dp-pm-booking .tap-date-strip{
    display:flex;
    gap:9px;

    padding:3px 2px 7px;

    overflow-x:auto;
    overflow-y:hidden;

    scroll-behavior:smooth;

    scrollbar-width:none;
}

.dp-pm-booking .tap-date-strip::-webkit-scrollbar{
    display:none;
}


.dp-pm-booking .tap-date-strip button{
    flex:0 0 92px;

    min-width:92px;
    min-height:78px;

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

    border:1px solid #dfe3ec;
    border-radius:13px;

    color:#27304f;
    background:#fff;

    cursor:pointer;

    transition:
        border-color .15s,
        background .15s,
        transform .15s,
        box-shadow .15s;
}


.dp-pm-booking .tap-date-strip button:hover{
    border-color:#8b6bf0;
    transform:translateY(-1px);
}


.dp-pm-booking .tap-date-strip button.active{
    color:#fff;

    border-color:#6c3ad9;

    background:
        linear-gradient(
            145deg,
            #7238e2,
            #2576ed
        );

    box-shadow:
        0 8px 20px
        rgba(83,62,220,.20);
}


.dp-pm-booking .tap-date-strip small{
    font-size:8px;
    font-weight:900;
    letter-spacing:.5px;
}

.dp-pm-booking .tap-date-strip b{
    margin:3px 0;

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

.dp-pm-booking .tap-date-strip span{
    font-size:8px;
    font-weight:700;
    opacity:.82;
}


/* ============================================================
   LEGEND
   ============================================================ */

.dp-pm-booking .slot-legend{
    display:flex;
    flex-wrap:wrap;
    gap:14px;

    margin:8px 0 16px;
}

.dp-pm-booking .slot-legend span{
    display:flex;
    align-items:center;
    gap:6px;

    color:#687087;

    font-size:8px;
    font-weight:700;
}

.dp-pm-booking .slot-legend i{
    width:11px;
    height:11px;

    display:block;

    border-radius:3px;
}

.dp-pm-booking .slot-legend i.available{
    background:#edf9f1;
    border:1px solid #72cf94;
}

.dp-pm-booking .slot-legend i.picked{
    background:#6f40dd;
    border:1px solid #6f40dd;
}

.dp-pm-booking .slot-legend i.held{
    background:#fff6d8;
    border:1px solid #e0bd48;
}

.dp-pm-booking .slot-legend i.booked{
    background:#fff0eb;
    border:1px solid #eea28e;
}

.dp-pm-booking .slot-legend i.blocked{
    background:#edf0ef;
    border:1px solid #c7cfcc;
}


/* ============================================================
   COURT / TIME GRID
   ============================================================ */

.dp-pm-booking .tap-grid-scroll{
    overflow:auto;

    border:1px solid #e2e5ed;
    border-radius:14px;

    background:#fff;
}

.dp-pm-booking .tap-slot-grid{
    display:grid;
    gap:7px;

    min-width:720px;

    padding:10px;
}


.dp-pm-booking .tap-grid-head{
    padding:10px 8px;

    text-align:center;

    color:#2e3859;

    background:#f5f7fb;

    border-radius:8px;

    font-size:9px;
    font-weight:1000;
}


.dp-pm-booking .tap-grid-head.time{
    text-align:left;
}


.dp-pm-booking .tap-time{
    min-height:60px;

    display:flex;
    align-items:center;
    gap:7px;

    padding:10px;

    color:#303954;

    background:#fafbfc;

    border-radius:8px;

    white-space:nowrap;

    font-size:9px;
}


.dp-pm-booking .tap-cell{
    min-height:60px;

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

    gap:3px;

    padding:7px;

    border-radius:9px;

    font-size:8px;
    font-weight:800;

    cursor:pointer;
}


/* AVAILABLE */

.dp-pm-booking .tap-cell.available{
    color:#0c8543;

    background:#f0faf3;

    border:1px solid #83d8a0;
}

.dp-pm-booking .tap-cell.available:hover{
    background:#e5f7eb;

    box-shadow:
        inset 0 0 0 1px
        #47bc75;
}


/* SELECTED */

.dp-pm-booking .tap-cell.picked{
    color:#fff;

    border-color:#633bd6;

    background:
        linear-gradient(
            135deg,
            #6f38df,
            #2378ec
        );

    box-shadow:
        0 5px 15px
        rgba(77,61,210,.17);
}


/* BOOKED */

.dp-pm-booking .tap-cell.booked{
    color:#c4563e;

    border:1px solid #efb1a1;

    background:#fff0eb;
}


/* HOLD */

.dp-pm-booking .tap-cell.held{
    color:#936d08;

    border:1px solid #e6cb67;

    background:#fff8df;
}

.dp-pm-booking .tap-cell.held span{
    margin-top:3px;
    text-align:center;

    font-size:6px;
}


/* BLOCKED */

.dp-pm-booking .tap-cell.blocked{
    color:#737d79;

    border:1px solid #d1d8d5;

    background:#eef1f0;
}


/* LAPSED */

.dp-pm-booking .tap-cell.lapsed{
    color:#9ba2a0;

    border:1px solid #e0e4e2;

    background:#f3f5f4;
}

.dp-pm-booking .tap-cell:disabled{
    cursor:not-allowed;
    opacity:1;
}


/* ============================================================
   FLOATING CHECKOUT BALLOON
   ============================================================ */

.dp-booking-float{
    position:fixed;

    z-index:3000;

    right:28px;
    bottom:26px;

    width:min(390px,calc(100vw - 30px));

    max-height:68vh;

    overflow:hidden;

    border:1px solid rgba(114,87,224,.20);
    border-radius:18px;

    color:#17213d;
    background:#fff;

    box-shadow:
        0 25px 80px
        rgba(14,18,48,.30);
}


.dp-booking-float .booking-float-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;

    padding:15px 16px;

    border-bottom:1px solid #eceef4;

    background:
        linear-gradient(
            135deg,
            #f8f6ff,
            #eef5ff
        );
}


.dp-booking-float .booking-float-summary{
    display:flex;
    flex-direction:column;
    gap:4px;
}

.dp-booking-float .booking-float-summary b{
    color:#363e5b;

    font-size:10px;
}

.dp-booking-float .booking-float-summary strong{
    color:#5c34cb;

    font-size:15px;
}


.dp-booking-float .booking-float-checkout{
    border:0;
    border-radius:10px;

    padding:12px 15px;

    color:#fff;

    background:
        linear-gradient(
            90deg,
            #7339df,
            #2878ef
        );

    font-size:9px;
    font-weight:1000;

    cursor:pointer;
}


.dp-booking-float .booking-float-items{
    max-height:46vh;

    overflow:auto;

    padding:10px 14px 14px;
}


.dp-booking-date-group{
    border-bottom:1px solid #eceef4;

    padding:10px 0;
}

.dp-booking-date-group:last-child{
    border-bottom:0;
}


.dp-booking-date-title{
    display:flex;
    align-items:center;
    justify-content:space-between;

    margin-bottom:6px;
}

.dp-booking-date-title span{
    color:#4f36ba;

    font-size:8px;
    font-weight:1000;
}

.dp-booking-date-title small{
    color:#8b91a4;

    font-size:7px;
}


.dp-balloon-slot-list{
    display:flex;
    flex-direction:column;
}


.dp-balloon-slot-list article{
    display:grid;

    grid-template-columns:1fr auto 22px;

    align-items:center;

    gap:8px;

    padding:8px 0;
}


.dp-balloon-slot-list article>div{
    display:flex;
    flex-direction:column;
    gap:3px;
}


.dp-balloon-slot-list article b{
    color:#232b48;

    font-size:9px;
}


.dp-balloon-slot-list article small{
    color:#858b9d;

    font-size:7px;
}


.dp-balloon-slot-list article strong{
    color:#252d48;

    font-size:9px;
}


.dp-balloon-slot-list article>button{
    border:0;

    color:#8d93a3;
    background:transparent;

    font-size:17px;

    cursor:pointer;
}


/* ============================================================
   LOADING
   ============================================================ */

.dp-tap-loading{
    padding:30px;

    text-align:center;

    color:#747b91;

    font-size:10px;
}


/* ============================================================
   MOBILE
   ============================================================ */

@media(max-width:760px){

    .dp-pm-booking .swipe-date-shell{
        grid-template-columns:38px minmax(0,1fr) 38px;
        gap:6px;
    }

    .dp-pm-booking .desktop-date-arrow{
        width:38px;
        height:54px;

        font-size:23px;
    }

    .dp-pm-booking .tap-date-strip button{
        flex-basis:78px;
        min-width:78px;
    }

    .dp-tap-booking-main{
        padding:12px;
    }

    .dp-booking-float{
        right:10px;
        left:10px;
        bottom:12px;

        width:auto;

        max-height:62vh;
    }

    .dp-booking-float .booking-float-top{
        padding:12px;
    }

    .dp-booking-float .booking-float-checkout{
        padding:11px 12px;
    }
}