/* The Coral Beach Resort — Fidelidade visual ao mockup aprovado · versão 2.0 */
:root{--navy:#122b3d;--deep:#102738;--coral:#0c6192;--teal:#0d7ea6;--gold:#d9ac6c;--paper:#fbfaf7;--line:#e5e3de;--text:#162a3b;--muted:#738396;--shadow:0 4px 18px #142c3d09;--radius:12px}
body{background:#faf9f6;color:#102335;font-family:Inter,"Segoe UI",Arial,sans-serif}
.sidebar{background:linear-gradient(160deg,#122839 0%,#102838 64%,#0b2332 100%);width:250px;min-width:250px;padding:0 15px 28px;box-shadow:none}
.side-brand{height:115px;padding:3px 0 2px;display:flex;justify-content:center;align-items:center;transform:none;margin:0}
.coral-brand-image{display:block;object-fit:contain;width:204px;height:98px}
.sidebar .side-nav{gap:4px}
.sidebar .nav-item{padding:12px 13px;color:#e6edf2;font-size:13px;border-radius:8px;font-weight:500;gap:14px;min-height:42px}
.sidebar .nav-item svg{width:20px;height:20px}
.sidebar .nav-item.active{background:linear-gradient(100deg,#004f84,#006496);color:white;font-weight:650;box-shadow:0 1px 0 #ffffff15 inset}
.sidebar .nav-item:hover{background:#145177;color:#fff}
.sidebar .side-section{margin:17px 11px 3px;padding:0;color:#cdd9e2;letter-spacing:.03em;font-size:11px;font-weight:600}
.side-divider{margin:0 9px 7px;background:#ffffff32;height:1px}
.sidebar .side-bottom{padding-top:16px}
.sidebar .logout-link{color:#afbfca;font-size:12px}
.main-shell{margin-left:250px;width:calc(100% - 250px);background:#faf9f6}
.mock-hero{height:76px;background-image:linear-gradient(90deg,#12313b03,#e4eee537),url('/assets/resort-banner.jpg');background-size:cover;background-position:center 50%;border:0;padding:10px 24px;display:flex;justify-content:flex-end}
.topbar-right{margin-left:auto}.account-chip{background:#f7f8f8eb;box-shadow:0 2px 15px #16334628;border:1px solid #e9eae7;display:flex;align-items:center;gap:10px;border-radius:32px;padding:7px 15px 7px 8px;min-width:178px}
.account-chip .account strong{font-size:12px;color:#142637}.account-chip .account span{font-size:10px;color:#6d7782}.account-chip .avatar{background:#102838;color:white;width:35px;height:35px;font-size:14px}
.account-chip svg{margin-left:auto;transform:rotate(90deg);color:#233a49}
.workspace{max-width:none;padding:25px 31px 34px;width:100%}
.main-footer{display:none}
/* Main entry form */
.mock-entry{max-width:1600px;margin:auto}.mock-titlebar{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:22px}
.mock-title-left{display:flex;align-items:center;gap:20px}.mock-title-left .title-gift{color:#07496a;line-height:1}
.mock-title-left h1{font-size:clamp(23px,2.15vw,34px);margin:0 0 4px;letter-spacing:-.8px;font-weight:750}
.mock-title-left p{color:#67798d;font-size:14px;margin:0}
.mock-date{display:flex;align-items:center;gap:13px;color:#263d4b;border:1px solid #dedfe0;background:#fffefcf2;border-radius:10px;padding:9px 12px;min-width:208px;min-height:52px}
.mock-date span{display:flex;flex-direction:column;font-size:10px;color:#637385;gap:2px}
.mock-date input{width:148px;font-size:13px;color:#182b40;border:0;background:transparent;min-height:22px;padding:0;cursor:pointer}
.mock-form-card{background:#fffefc;border:1px solid #e0dfda;border-radius:13px;box-shadow:0 4px 18px #172d3b07;padding:21px 19px 17px}
.mock-first-row{display:grid;grid-template-columns:minmax(235px,.315fr) minmax(0,1fr);gap:29px}
.mock-first-row strong,.mock-observations>strong{font-size:13px;display:block;margin-bottom:11px;font-weight:750;color:#17273b}
.mock-uh{display:block}.mock-uh .required{color:#dd3b3b}.mock-uh input{height:42px;width:100%;border:1.5px solid #1398db;background:#fff;border-radius:6px;padding:0 13px;font-size:13px;color:#17273b;box-shadow:0 0 0 1px #0d84bb0d}
.mock-uh input:focus{border-color:#008bdb;box-shadow:0 0 0 3px #229bdb22}.mock-uh input::placeholder{color:#8795a4}
.mock-gifts{min-width:0}.mock-gift-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
.mock-gift-item{position:relative;border:1px solid #e5e5e2;border-radius:6px;display:flex;flex-direction:column;justify-content:space-between;align-items:center;text-align:center;background:#fffefc;cursor:pointer;height:137px;padding:8px 5px 9px;transition:border-color .15s,background .15s,box-shadow .15s;min-width:0}
.mock-gift-item:hover{border-color:#70b4cf;background:#f8fcff}
.mock-gift-item:has(input:checked){border-color:#078ccb;background:#f1faff;box-shadow:0 0 0 1px #69b9e3 inset}
.mock-gift-item input{position:absolute;opacity:0;pointer-events:none}
.mock-gift-item img{display:block;max-width:95%;width:110px;height:90px;object-fit:contain;margin:3px auto 1px;flex:1;min-height:0}
.mock-gift-item>span:last-child{font-size:12px;line-height:1.25;color:#1c2b37;min-height:27px;display:flex;align-items:center;justify-content:center}
.mock-gift-item .fake-check{position:absolute;top:11px;left:10px;z-index:2;border:1.5px solid #8b9ba7;width:16px;height:16px;display:grid;place-items:center;background:white;border-radius:3px;color:transparent}
.mock-gift-item:has(input:checked) .fake-check{background:#0986ae;color:white;border-color:#0986ae}
.mock-gift-item:focus-within{outline:2px solid #0b84c4;outline-offset:2px}
.gift-number{font-size:11px;color:#0b83a5;border-radius:4px;background:#e7f4fa;padding:2px 6px;margin-left:5px}
.mock-observations{margin-top:22px}.mock-event-row{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.mock-event{border:1px solid #e1e3e1;border-radius:7px;padding:10px 13px;background:#fffefc;color:#36485a;font-size:12px;display:flex;gap:8px;align-items:center;white-space:nowrap;cursor:pointer;min-height:40px;transition:.2s}
.mock-event input{position:absolute;opacity:0;pointer-events:none}.mock-event .event-icon{color:#49687c;display:flex}.mock-event:has(input:checked){border-color:#0a87cd;background:#effaff;color:#086ca5;font-weight:650}.mock-event:has(input:checked) .event-icon{color:#008dd3}.mock-event:focus-within{outline:2px solid #0a84bb;outline-offset:2px}
.mock-observations textarea{display:block;width:100%;min-height:70px;height:70px;padding:11px 14px;border-radius:7px;border:1px solid #dfe2e0;background:#fffefc;font-size:13px;color:#253749;resize:vertical}.mock-observations textarea:focus{border-color:#1398db;box-shadow:0 0 0 3px #0a8bd51c}
.mock-observations textarea::placeholder{color:#8794a2}
.mock-form-actions{display:flex;align-items:center;gap:15px;justify-content:space-between;margin-top:17px}.mock-form-actions .btn.ghost{min-width:115px;border-radius:7px}
.mock-form-actions .save-meta{margin-left:auto;font-size:11px;color:#8793a1}.mock-save.btn.primary{background:linear-gradient(100deg,#057da7,#046c96);min-width:253px;border-radius:6px;font-size:13px;min-height:43px}
.mock-save:hover{filter:brightness(1.1)}
/* Reports and record list */
.mock-page-title{display:flex;align-items:center;gap:16px;margin:0 0 22px}.mock-page-title h1{font-size:clamp(21px,2.12vw,31px);margin:0 0 3px;letter-spacing:-.7px}.mock-page-title p{font-size:12px;color:#64778a;margin:0}.small-title-symbol{color:#0c3958}.period-top,.mock-page-title .title-action{margin-left:auto}
.period-top{display:flex;align-items:center;gap:8px;border:1px solid #dfe1e1;background:white;color:#536478;padding:10px 12px;border-radius:7px;font-size:11px;white-space:nowrap}
.surface{background:#fffefc;border:1px solid #e6e5e0;border-radius:11px;box-shadow:0 4px 20px #22313f07;padding:18px}
.mock-filters{margin:0 0 18px}.mock-filters .filter-grid{grid-template-columns:1fr 1fr 1.2fr 1.1fr 1.1fr auto;gap:10px;align-items:end}.mock-filters .filter-grid>label{font-size:10px;color:#263f4b;font-weight:700}
.mock-filters input,.mock-filters select{border-radius:6px;min-height:38px;font-size:11px}.mock-filters .apply-filter{background:#097a9e;min-height:38px;border-radius:6px}
.mock-table{min-width:980px}.mock-table th{font-size:10px;padding:12px 10px;white-space:normal;text-align:center;color:#163040}.mock-table th:nth-child(1),.mock-table th:nth-child(2){text-align:left}
.mock-table td{font-size:11px;padding:11px 9px;border-bottom:1px solid #ecf0f1}.mock-table td:nth-child(1),.mock-table td:nth-child(2){white-space:nowrap}
.mock-table .table-check{text-align:center}.tick{color:#009481;font-size:17px;font-weight:850}.empty-tick{color:#aeb8bb}.notes-cell{min-width:140px;max-width:240px;white-space:normal}.mock-table tr.cancelled{opacity:.58}
.mock-list-surface{padding:0}.mock-list-surface .table-scroll{max-height:none;overflow-x:auto}.mock-list-surface .pagination{margin:0;padding:17px 20px;justify-content:space-between;font-size:11px;color:#708194}.paging-buttons{display:flex;gap:6px;align-items:center}.paging-buttons .btn{min-height:31px;padding:6px 10px;border-radius:5px}.page-num{display:grid;place-items:center;width:31px;height:31px;background:#0b7b9e;color:white;border-radius:5px}
.mock-stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0 0 18px}
.stat-tile{background:#fffefc;border:1px solid #e5e3de;box-shadow:0 3px 13px #233a5005;border-radius:8px;padding:11px;display:flex;align-items:center;gap:10px;min-height:82px}
.stat-picture{width:63px;height:61px;display:flex;justify-content:center;align-items:center;flex-shrink:0;color:#0786bd}.stat-picture img{width:62px;height:59px;object-fit:contain}
.stat-tile small{display:block;font-size:10px;color:#465a66;line-height:1.3;margin-bottom:5px}.stat-tile strong{font-size:27px;line-height:1.1;font-weight:750;color:#172b42}
.mock-chart-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:0 0 16px}.mock-chart-grid .surface{min-height:275px}.mock-chart-grid .section-head h2{font-size:14px}.mock-chart-grid .section-head p{font-size:10px}
.mock-chart-grid .mini-chart{height:186px;align-items:flex-end}.mock-chart-grid .chart-column{height:100%;justify-content:flex-end}.mock-chart-grid .chart-bar{background:linear-gradient(180deg,#25adf1,#1289c7)}
.event-bars{display:flex;flex-direction:column;gap:16px;padding:18px 3px 10px}.event-bar-row{display:grid;grid-template-columns:150px minmax(50px,1fr) 36px;gap:12px;align-items:center}.event-bar-row>span{font-size:11px;color:#263b4c;text-align:right}.event-bar-row>b{font-size:11px;color:#566b7b}.event-bar-track{height:17px;background:#eff7fa;border-radius:3px;overflow:hidden}.event-bar-track i{display:block;height:100%;background:linear-gradient(90deg,#2bacf0,#069ad3);border-radius:3px}
.mock-chart-grid .data-table{min-width:700px}.mock-chart-grid .table-scroll{max-height:250px;overflow:auto}.report-export-bottom{display:flex;justify-content:flex-end;padding-top:5px}
.mock-filters .checkbox-filter{padding-bottom:8px!important}
/* Desktop responsive */
@media(max-width:1500px){.mock-gift-grid{gap:7px}.mock-gift-item{height:125px}.mock-gift-item img{height:75px}.mock-gift-item>span:last-child{font-size:11px}.mock-first-row{grid-template-columns:minmax(200px,.3fr) minmax(0,1fr);gap:22px}.mock-filters .filter-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.mock-stat-grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:1180px){.mock-first-row{grid-template-columns:1fr}.mock-gift-item{height:132px}.mock-gift-item img{height:85px}.mock-titlebar{align-items:flex-start}.mock-gift-grid{gap:10px}.mock-chart-grid{grid-template-columns:1fr}.mock-chart-grid .surface{min-height:240px}}
@media(max-width:980px){.sidebar{width:220px;min-width:220px}.main-shell{margin-left:220px;width:calc(100% - 220px)}.workspace{padding:22px}.mock-gift-grid{grid-template-columns:repeat(3,1fr)}.mock-stat-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.sidebar{width:250px;min-width:250px}.main-shell{margin-left:0;width:100%}.mock-hero{height:72px;padding:12px 16px}.mock-hero .menu-trigger{display:block;background:#fffefce6;border:1px solid #ffffffaa;border-radius:8px;padding:8px}.workspace{padding:21px 13px}.mock-titlebar{flex-direction:column;gap:14px}.mock-title-left{gap:12px}.mock-title-left h1{font-size:23px}.mock-title-left p{font-size:12px}.mock-date{align-self:stretch;max-width:240px}.mock-form-card{padding:18px 13px}.mock-first-row{gap:19px}.mock-gift-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.mock-gift-item{height:133px}.mock-gift-item img{height:86px}.mock-event{width:calc(50% - 5px);font-size:11px;white-space:normal}.mock-form-actions{flex-wrap:wrap}.mock-form-actions .save-meta{width:100%;order:-1;margin:0}.mock-save.btn.primary{flex:1;min-width:190px}.mock-page-title{flex-wrap:wrap;gap:10px}.mock-page-title .period-top,.mock-page-title .title-action{margin-left:0;width:100%;justify-content:center}.mock-filters .filter-grid{grid-template-columns:1fr 1fr}.mock-filters .filter-grid .apply-filter{grid-column:1/-1}.mock-stat-grid{grid-template-columns:repeat(2,1fr);gap:8px}.stat-tile{padding:7px;gap:3px}.stat-picture{width:47px;height:51px}.stat-picture img{max-width:47px;max-height:51px}.stat-tile small{font-size:9px}.stat-tile strong{font-size:23px}.event-bar-row{grid-template-columns:105px minmax(40px,1fr) 25px;gap:6px}.event-bar-row>span{font-size:10px}.sidebar.shown{transform:translateX(0)}.account-chip{min-width:155px;padding-right:10px}}
