/* ===== style.css ===== */ :root{--bg:#f5f7fb;--surface:#fff;--surface-2:#f8fafc;--text:#172033;--muted:#64748b;--line:#e7ecf3;--primary:#0f766e;--primary-2:#115e59;--blue:#2563eb;--amber:#d97706;--violet:#7c3aed;--danger:#b91c1c;--shadow:0 12px 34px rgba(15,23,42,.07);--radius:18px} *{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Tahoma,"Segoe UI",Arial,sans-serif;background:var(--bg);color:var(--text);font-size:14px}button,input,select{font:inherit}a{color:inherit}.app-shell{min-height:100vh}.sidebar{position:fixed;right:0;top:0;bottom:0;width:278px;background:linear-gradient(180deg,#0d2529,#0b1f24);color:#fff;padding:22px 18px;display:flex;flex-direction:column;z-index:30;box-shadow:-8px 0 30px rgba(15,23,42,.12)}.brand{display:flex;gap:11px;align-items:center;padding:2px 4px 18px;border-bottom:1px solid rgba(255,255,255,.1)}.brand-mark{width:44px;height:44px;border-radius:14px;background:linear-gradient(135deg,#2dd4bf,#0f766e);display:grid;place-items:center;font-weight:900;letter-spacing:-1px;box-shadow:0 8px 20px rgba(45,212,191,.18)}.brand strong{display:block;font-size:15px}.brand span{display:block;color:#9eb4b9;font-size:11px;margin-top:5px}.sidebar-close{display:none;margin-right:auto}.user-panel{margin:18px 2px 8px;padding:13px;background:rgba(255,255,255,.065);border:1px solid rgba(255,255,255,.08);border-radius:16px;display:flex;align-items:center;gap:10px}.avatar{width:39px;height:39px;flex:0 0 auto;border-radius:12px;background:#e0f2f1;color:var(--primary-2);display:grid;place-items:center;font-weight:800;text-decoration:none}.user-panel b{display:block;font-size:13px}.user-panel small{display:block;color:#9eb4b9;margin-top:4px;font-size:11px}.sidebar-nav{display:flex;flex-direction:column;gap:4px;overflow:auto;padding:8px 0}.nav-caption{font-size:10px;color:#789096;padding:13px 12px 5px}.sidebar-nav a,.logout-link{display:flex;align-items:center;gap:11px;text-decoration:none;color:#cad8da;padding:11px 13px;border-radius:12px;transition:.2s}.sidebar-nav a span,.logout-link span{width:22px;text-align:center;font-size:18px}.sidebar-nav a:hover,.sidebar-nav a.active{background:linear-gradient(90deg,rgba(45,212,191,.18),rgba(45,212,191,.06));color:#fff}.sidebar-nav a.active{box-shadow:inset -3px 0 #2dd4bf}.logout-link{margin-top:auto;color:#fca5a5;background:rgba(239,68,68,.06)}.workspace{margin-right:278px;min-height:100vh}.topbar{height:74px;background:rgba(255,255,255,.9);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 28px;position:sticky;top:0;z-index:20}.topbar-title b{display:block;font-size:16px}.topbar-title small{display:block;color:var(--muted);font-size:11px;margin-top:4px}.topbar-actions{margin-right:auto;display:flex;align-items:center;gap:12px}.role-badge{padding:7px 11px;border-radius:999px;background:#ecfdf5;color:#047857;font-size:11px;font-weight:bold}.small-avatar{width:38px;height:38px}.icon-button{border:0;background:transparent;color:inherit;cursor:pointer;font-size:25px}.menu-button{display:none;margin-left:10px}.page-content{padding:28px;max-width:1600px;margin:auto}.flash{padding:13px 15px;border-radius:13px;margin-bottom:17px;display:flex;align-items:center;gap:9px;border:1px solid}.flash span{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-weight:bold}.flash.success{background:#ecfdf5;color:#065f46;border-color:#a7f3d0}.flash.success span{background:#d1fae5}.flash.danger{background:#fff1f2;color:#9f1239;border-color:#fecdd3}.flash.danger span{background:#ffe4e6}.hero-panel{background:linear-gradient(135deg,#0f766e,#155e75);color:#fff;border-radius:24px;padding:27px 30px;display:flex;justify-content:space-between;align-items:center;gap:20px;box-shadow:0 16px 40px rgba(15,118,110,.19);overflow:hidden;position:relative}.hero-panel:after{content:"";position:absolute;width:250px;height:250px;border-radius:50%;background:rgba(255,255,255,.07);left:-60px;top:-120px}.eyebrow{font-size:10px;font-weight:900;letter-spacing:2px;color:#2dd4bf}.hero-panel .eyebrow{color:#99f6e4}.hero-panel h1,.page-heading h1{margin:7px 0 8px;font-size:25px}.hero-panel p,.page-heading p{margin:0;color:rgba(255,255,255,.75)}.hero-actions{display:flex;gap:10px;position:relative;z-index:2}.button{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:11px;padding:11px 15px;text-decoration:none;cursor:pointer;font-weight:700;font-size:12px;white-space:nowrap}.button.primary,button.primary,button.button:not(.secondary):not(.ghost-danger){background:var(--primary);color:#fff}.hero-panel .button.primary{background:#fff;color:var(--primary-2)}.button.light{background:rgba(255,255,255,.14);color:#fff;border:1px solid rgba(255,255,255,.22)}.button.secondary,.secondary{background:#eef2f7;color:#334155}.button.ghost-danger,.danger{background:#fff1f2;color:var(--danger)}.button.full{width:100%}.stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin:18px 0}.stat-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.stat-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:18px;display:flex;align-items:center;gap:14px;box-shadow:0 7px 20px rgba(15,23,42,.035)}.stat-icon{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;font-size:20px;font-weight:bold}.stat-icon.teal{background:#ccfbf1;color:#0f766e}.stat-icon.blue{background:#dbeafe;color:#1d4ed8}.stat-icon.amber{background:#fef3c7;color:#b45309}.stat-icon.violet{background:#ede9fe;color:#6d28d9}.stat-card span{display:block;color:var(--muted);font-size:11px}.stat-card strong{display:block;font-size:24px;margin:4px 0 3px}.stat-card small{color:#94a3b8;font-size:10px}.dashboard-grid{display:grid;grid-template-columns:2fr 1fr;gap:18px;margin-bottom:18px}.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow)}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:18px}.panel-head h2{margin:0;font-size:16px}.panel-head p{margin:5px 0 0;color:var(--muted);font-size:11px}.panel-head>a{color:var(--primary);font-size:11px;text-decoration:none;font-weight:bold}.owner-progress-list{display:grid;gap:16px}.owner-progress{display:grid;grid-template-columns:minmax(180px,1fr) minmax(240px,1.4fr);align-items:center;gap:18px;padding-bottom:15px;border-bottom:1px solid var(--line)}.owner-progress:last-child{border-bottom:0;padding-bottom:0}.owner-name{display:flex;align-items:center;gap:10px}.owner-name b{display:block}.owner-name small{display:block;color:var(--muted);margin-top:4px;font-size:10px}.progress-meta{display:flex;justify-content:space-between;color:var(--muted);font-size:10px;margin-bottom:7px}.progress-meta b{color:var(--text)}.progress{height:8px;border-radius:99px;background:#edf2f7;overflow:hidden}.progress i{display:block;height:100%;background:linear-gradient(90deg,#14b8a6,#0f766e);border-radius:99px}.donut-wrap{display:grid;place-items:center;gap:20px}.donut{--value:0;width:155px;height:155px;border-radius:50%;background:conic-gradient(var(--primary) calc(var(--value)*1%),#e7edf2 0);display:grid;place-items:center;position:relative}.donut:after{content:"";position:absolute;width:112px;height:112px;border-radius:50%;background:#fff}.donut>div{position:relative;z-index:1;text-align:center}.donut strong{display:block;font-size:27px}.donut span{color:var(--muted);font-size:10px}.legend{width:100%}.legend p{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;margin:8px 0;color:var(--muted);font-size:11px}.legend b{color:var(--text)}.dot{width:8px;height:8px;border-radius:50%}.dot.allocated{background:var(--primary)}.dot.free{background:#dfe7ee}.period-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.period-card{border:1px solid var(--line);border-radius:15px;padding:15px;background:#fcfdff;position:relative;overflow:hidden}.period-card:before{content:"";position:absolute;right:0;top:0;bottom:0;width:4px;background:#94a3b8}.period-card.special:before{background:var(--amber)}.period-type{font-size:9px;color:var(--muted)}.period-card h3{font-size:14px;margin:8px 0}.period-card p{color:var(--muted);font-size:10px}.period-card p span{padding:0 5px}.period-card footer{margin-top:13px}.status-chip{display:inline-flex;padding:5px 9px;border-radius:99px;font-size:9px;font-weight:bold}.status-chip.free{background:#f1f5f9;color:#475569}.status-chip.allocated,.status-chip.active{background:#ecfdf5;color:#047857}.empty-state{padding:28px;text-align:center;color:var(--muted);background:var(--surface-2);border-radius:13px;border:1px dashed #cbd5e1}.empty-state.wide{grid-column:1/-1}.page-heading{margin-bottom:16px}.page-heading .eyebrow{color:var(--primary)}.page-heading p{color:var(--muted)}.content-grid.owners-layout{display:grid;grid-template-columns:340px minmax(0,1fr);gap:18px;align-items:start}.sticky-form{position:sticky;top:92px}.form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.form-grid.single{grid-template-columns:1fr}.form-grid label,.auth-form label{display:grid;gap:7px;color:#475569;font-size:11px;font-weight:bold}input,select{width:100%;border:1px solid #dbe3ed;border-radius:11px;background:#fff;padding:11px 12px;color:var(--text);outline:none;transition:.2s}input:focus,select:focus{border-color:#5eead4;box-shadow:0 0 0 3px rgba(45,212,191,.12)}.form-divider{display:flex;align-items:center;gap:8px;color:#94a3b8;font-size:10px}.form-divider:before,.form-divider:after{content:"";height:1px;background:var(--line);flex:1}.form-hint{color:var(--muted);font-size:10px;line-height:1.8;margin:0}.search-box{display:flex;align-items:center;gap:5px;border:1px solid var(--line);border-radius:10px;padding:0 10px;color:var(--muted)}.search-box input{border:0;box-shadow:none;padding:8px;width:170px}.owner-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.owner-card{border:1px solid var(--line);border-radius:16px;padding:15px;background:#fff}.owner-card-head{display:flex;align-items:center;gap:10px}.avatar.large{width:46px;height:46px;border-radius:14px}.owner-card-head h3{margin:0;font-size:14px}.owner-card-head p{margin:5px 0 0;color:var(--muted);font-size:10px}.owner-card-head .status-chip{margin-right:auto}.owner-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:14px 0}.owner-metrics div{background:var(--surface-2);border-radius:11px;padding:10px;text-align:center}.owner-metrics span,.owner-account span{display:block;color:var(--muted);font-size:9px}.owner-metrics b{display:block;margin-top:5px}.owner-account{display:flex;justify-content:space-between;padding:10px 0;border-top:1px solid var(--line);font-size:10px}.card-actions{display:flex;gap:8px}.card-actions .button,.card-actions form{flex:1}.card-actions button{width:100%}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse}th,td{padding:12px;border-bottom:1px solid var(--line);text-align:center;white-space:nowrap}th{font-size:10px;color:var(--muted);background:var(--surface-2)}td{font-size:11px}.actions{display:flex;gap:7px;justify-content:center}.actions form{margin:0}.narrow{max-width:650px}.narrow form{display:grid;gap:14px}.muted{color:var(--muted);font-size:11px}.auth-page{min-height:100vh;display:grid;grid-template-columns:1.1fr .9fr;background:#fff}.auth-showcase{background:linear-gradient(145deg,#092f33,#0f766e);color:#fff;padding:70px;display:flex;align-items:center;position:relative;overflow:hidden}.auth-showcase:before,.auth-showcase:after{content:"";position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.09)}.auth-showcase:before{width:500px;height:500px;right:-170px;bottom:-250px}.auth-showcase:after{width:280px;height:280px;left:-100px;top:-120px}.showcase-content{position:relative;z-index:1;max-width:570px}.brand-mark.jumbo{width:64px;height:64px;font-size:20px;margin-bottom:28px}.showcase-content h1{font-size:38px;line-height:1.65;margin:10px 0}.showcase-content p{color:#b9d7d6;line-height:2;font-size:15px}.feature-pills{display:flex;flex-wrap:wrap;gap:9px;margin-top:28px}.feature-pills span{padding:9px 12px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.1);border-radius:99px;font-size:11px}.auth-form-wrap{display:grid;place-items:center;padding:35px}.auth-card{width:min(410px,100%)}.auth-card h2{font-size:25px;margin:7px 0}.auth-card>p{color:var(--muted);line-height:1.8}.auth-form{display:grid;gap:16px;margin-top:25px}.input-icon{position:relative}.input-icon span{position:absolute;right:12px;top:50%;transform:translateY(-50%);color:#94a3b8}.input-icon input{padding-right:38px;height:46px}.auth-form .button{height:46px;margin-top:4px}.login-note{text-align:center;font-size:10px!important;margin-top:20px}.login-note code{background:#f1f5f9;padding:3px 6px;border-radius:5px}.mobile-brand{display:none;align-items:center;gap:10px;margin-bottom:28px}.sidebar-backdrop{display:none} @media(max-width:1100px){.stat-grid{grid-template-columns:repeat(2,1fr)}.period-cards{grid-template-columns:repeat(2,1fr)}.content-grid.owners-layout{grid-template-columns:300px minmax(0,1fr)}.owner-card-grid{grid-template-columns:1fr}} @media(max-width:900px){.sidebar{transform:translateX(105%);transition:.25s}.workspace{margin-right:0}.menu-button,.sidebar-close{display:block}.sidebar-backdrop{position:fixed;inset:0;background:rgba(15,23,42,.45);z-index:25}.sidebar-open .sidebar{transform:none}.sidebar-open .sidebar-backdrop{display:block}.topbar{padding:0 16px}.page-content{padding:18px}.dashboard-grid{grid-template-columns:1fr}.content-grid.owners-layout{grid-template-columns:1fr}.sticky-form{position:static}.auth-page{grid-template-columns:1fr}.auth-showcase{display:none}.mobile-brand{display:flex}} @media(max-width:640px){body{font-size:13px}.page-content{padding:12px}.topbar{height:64px}.role-badge{display:none}.hero-panel{padding:21px;display:block}.hero-panel h1,.page-heading h1{font-size:20px}.hero-actions{margin-top:18px;display:grid;grid-template-columns:1fr 1fr}.stat-grid,.stat-grid.three{grid-template-columns:1fr 1fr;gap:10px}.stat-card{padding:13px;gap:10px}.stat-icon{width:42px;height:42px}.stat-card strong{font-size:20px}.panel{padding:15px}.owner-progress{grid-template-columns:1fr;gap:10px}.period-cards{grid-template-columns:1fr}.owner-card-grid{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.panel-head{align-items:flex-start}.search-box{width:100%;margin-top:8px}.panel-head:has(.search-box){display:block}.search-box input{width:100%}.auth-form-wrap{padding:24px}.auth-card h2{font-size:22px}.owner-metrics{gap:5px}.topbar-title small{display:none}} @media(max-width:390px){.stat-grid,.stat-grid.three{grid-template-columns:1fr}.hero-actions{grid-template-columns:1fr}} /* Rich owner profile */ .owner-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}.owner-heading h1{margin:4px 0}.heading-actions{display:flex;gap:10px}.owner-list-panel{margin-bottom:20px}.owner-list-tools{align-items:flex-end}.owner-filters{display:flex;gap:10px;align-items:center}.owner-filters select{min-width:155px}.owner-card.rich{display:flex;flex-direction:column;gap:12px}.owner-main{min-width:0}.owner-main h3,.owner-main p{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.owner-quick-info{display:grid;gap:6px;color:var(--muted);font-size:10px;border-top:1px solid var(--line);padding-top:12px}.owner-modal{position:fixed;inset:0;z-index:100;display:none}.owner-modal.open{display:block}.owner-modal-backdrop{position:absolute;inset:0;background:rgba(15,23,42,.55);backdrop-filter:blur(3px)}.owner-modal-card{position:absolute;inset:4vh 4vw;background:#fff;border-radius:24px;box-shadow:0 24px 80px rgba(15,23,42,.3);display:flex;flex-direction:column;overflow:hidden}.owner-modal-card>header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border-bottom:1px solid var(--line)}.owner-modal-card>header h2{margin:0}.owner-modal-card>header p{margin:5px 0 0;color:var(--muted);font-size:11px}.owner-modal-card form{display:flex;flex-direction:column;min-height:0;flex:1}.modal-close{border:0;background:#f1f5f9;border-radius:10px;width:38px;height:38px;font-size:24px;cursor:pointer}.modal-actions,.form-footer{display:flex;justify-content:flex-end;gap:10px;padding:16px 22px;border-top:1px solid var(--line);background:#fff}.modal-open{overflow:hidden}.owner-form-shell{display:flex;flex:1;min-height:0;background:#f8fafc}.owner-tabs{width:220px;background:#fff;border-left:1px solid var(--line);padding:16px;display:flex;flex-direction:column;gap:8px}.owner-tab{border:0;background:transparent;padding:12px 14px;text-align:right;border-radius:11px;color:#475569;font-weight:bold;cursor:pointer}.owner-tab.active{background:#ecfdf5;color:#0f766e}.owner-tab-panel{display:none;flex:1;padding:24px;overflow:auto}.owner-tab-panel.active{display:block}.section-title{margin-bottom:18px}.section-title b{display:block;font-size:17px}.section-title span{display:block;color:var(--muted);font-size:11px;margin-top:6px}.owner-fields{grid-template-columns:repeat(3,minmax(0,1fr))}.owner-fields textarea{width:100%;border:1px solid #dbe3ed;border-radius:11px;padding:11px 12px;resize:vertical;font:inherit}.span-2{grid-column:span 2}.span-3{grid-column:span 3}.legal-only{display:none!important}.legal-person .legal-only{display:grid!important}.legal-person .individual-only{display:none!important}.account-existing{background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px;display:grid;gap:6px;max-width:480px}.account-existing span,.account-existing small{color:var(--muted)}.owner-edit-panel{padding:0;overflow:hidden}.owner-edit-panel .owner-form-shell{min-height:520px}.owner-edit-panel .form-footer{border-top:1px solid var(--line)}.owner-profile-hero{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:18px}.owner-profile-id{display:flex;align-items:center;gap:15px}.avatar.xlarge{width:72px;height:72px;border-radius:22px;font-size:24px}.owner-profile-id h2{margin:0 0 5px}.owner-profile-id p{margin:0 0 8px;color:var(--muted)}.owner-profile-stats{display:grid;grid-template-columns:repeat(4,minmax(90px,1fr));gap:10px}.owner-profile-stats div{background:var(--surface-2);border-radius:14px;padding:14px;text-align:center}.owner-profile-stats span{display:block;color:var(--muted);font-size:10px}.owner-profile-stats strong{display:block;margin-top:6px;font-size:20px}.profile-section-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-bottom:18px}.info-section h3{margin:0 0 16px;font-size:15px}.info-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.info-grid div{background:var(--surface-2);border-radius:12px;padding:12px}.info-grid .wide{grid-column:1/-1}.info-grid span{display:block;color:var(--muted);font-size:9px;margin-bottom:6px}.info-grid b{font-size:11px;word-break:break-word}.manager-note{margin:0;color:#475569;line-height:2}.button.ghost-danger{background:#fff1f2;color:#be123c} @media(max-width:900px){.owner-heading{align-items:flex-start}.owner-modal-card{inset:2vh 2vw}.owner-form-shell{display:block;overflow:auto}.owner-tabs{width:auto;border-left:0;border-bottom:1px solid var(--line);flex-direction:row;overflow:auto;position:sticky;top:0;z-index:2}.owner-tab{white-space:nowrap}.owner-tab-panel{overflow:visible}.owner-profile-hero{display:block}.owner-profile-stats{margin-top:18px}.profile-section-grid{grid-template-columns:1fr}} @media(max-width:640px){.owner-heading{display:block}.owner-heading>.button,.heading-actions{margin-top:12px}.heading-actions{display:grid;grid-template-columns:1fr 1fr}.owner-filters{display:grid;grid-template-columns:1fr;width:100%;margin-top:12px}.owner-filters select{width:100%}.owner-modal-card{inset:0;border-radius:0}.owner-modal-card>header{padding:14px}.owner-tabs{padding:10px}.owner-tab-panel{padding:16px}.owner-fields{grid-template-columns:1fr}.span-2,.span-3{grid-column:auto}.modal-actions{padding:12px}.owner-profile-stats{grid-template-columns:repeat(2,1fr)}.info-grid{grid-template-columns:1fr}.info-grid .wide{grid-column:auto}} /* Users & access design system */ .users-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px}.users-heading h1{margin:5px 0 7px;font-size:28px}.users-heading p{margin:0;color:var(--muted)}.eyebrow{color:#0f766e;font-size:10px;font-weight:800}.user-stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:18px}.user-stat{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px;box-shadow:var(--shadow)}.user-stat span,.user-stat small{display:block;color:var(--muted);font-size:10px}.user-stat strong{display:block;font-size:27px;margin:7px 0}.user-list-panel{padding:0;overflow:hidden}.user-tools{padding:18px 20px;border-bottom:1px solid var(--line)}.user-tools h2{margin:0 0 5px}.user-search{width:min(360px,100%)}.user-search input{width:100%}.user-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;padding:18px}.user-card{border:1px solid var(--line);border-radius:18px;padding:17px;background:#fff;transition:.18s}.user-card:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(15,23,42,.08)}.user-card-top{display:flex;align-items:center;gap:12px}.user-avatar{width:48px;height:48px;border-radius:15px;font-size:17px}.user-identity{min-width:0}.user-identity h3{margin:0 0 4px;font-size:14px}.user-identity p{margin:0;color:var(--muted);direction:ltr;text-align:right}.status-chip{margin-right:auto;padding:6px 9px;border-radius:999px;font-size:9px;font-weight:800}.active-status{background:#ecfdf5;color:#047857}.inactive-status{background:#fff1f2;color:#be123c}.user-role-row{display:flex;align-items:center;justify-content:space-between;background:var(--surface-2);border-radius:11px;padding:10px 12px;margin:14px 0}.user-role-row span{color:var(--muted);font-size:9px}.user-role-row b{font-size:11px}.user-meta-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.user-meta-grid div{border:1px solid var(--line);border-radius:10px;padding:10px}.user-meta-grid span{display:block;color:var(--muted);font-size:8px;margin-bottom:5px}.user-meta-grid b{display:block;font-size:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-card-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-top:14px}.user-card-actions form,.user-card-actions button{width:100%;margin:0}.access-button{background:#e6fffb;color:#0f766e}.user-modal{position:fixed;inset:0;z-index:120;display:none}.user-modal.open{display:block}.user-modal-backdrop{position:absolute;inset:0;background:rgba(15,23,42,.58);backdrop-filter:blur(4px)}.user-modal-card{position:absolute;inset:3vh 4vw;background:#fff;border-radius:24px;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 28px 90px rgba(15,23,42,.35)}.user-modal-card>header{display:flex;align-items:center;justify-content:space-between;padding:19px 22px;border-bottom:1px solid var(--line)}.user-modal-card>header h2{margin:0 0 4px}.user-modal-card>header p{margin:0;color:var(--muted);font-size:10px}.user-modal-card form{display:flex;flex-direction:column;min-height:0;flex:1}.user-form-scroll{overflow:auto;padding:20px;background:#f8fafc}.user-form-section{background:#fff;border:1px solid var(--line);border-radius:17px;padding:18px;margin-bottom:14px}.user-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.user-fields textarea,.user-form-section>textarea{width:100%;border:1px solid #dbe3ed;border-radius:11px;padding:11px;resize:vertical;font:inherit}.password-field{display:flex}.password-field input{border-radius:0 11px 11px 0}.password-field button{width:42px;border:1px solid #dbe3ed;border-right:0;background:#f8fafc;border-radius:11px 0 0 11px}.generate-pass{align-self:end;height:42px}.role-card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.role-card{position:relative}.role-card input{position:absolute;opacity:0}.role-card span{display:block;border:1px solid var(--line);border-radius:13px;padding:13px;cursor:pointer}.role-card b,.role-card small{display:block}.role-card small{color:var(--muted);font-size:9px;margin-top:5px}.role-card input:checked+span{border-color:#14b8a6;background:#f0fdfa;box-shadow:0 0 0 3px rgba(20,184,166,.1)}.permission-title{display:flex;justify-content:space-between;align-items:center}.text-button{border:0;background:transparent;color:#0f766e;font-weight:700;cursor:pointer}.permission-group-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}.permission-group{border:1px solid var(--line);border-radius:13px;padding:13px;background:#fff}.permission-group h4,.permission-group h3{margin:0 0 10px}.permission-group>label{display:flex;align-items:center;gap:8px;padding:7px 0;color:#475569;font-size:10px}.permission-group input{width:17px;height:17px;accent-color:#0f766e}.access-panel{padding:0;overflow:hidden}.admin-access-note{margin:18px;background:#ecfdf5;border:1px solid #a7f3d0;color:#065f46;border-radius:13px;padding:13px}.permission-toolbar{display:flex;justify-content:space-between;align-items:center;padding:18px;border-bottom:1px solid var(--line)}.permission-toolbar span{display:block;color:var(--muted);font-size:10px;margin-top:5px}.access-grid{padding:18px;background:#f8fafc}.permission-group-head{display:flex;justify-content:space-between;align-items:center}.group-toggle{display:flex;gap:5px;align-items:center;font-size:9px}.user-edit-form{padding:20px}.section-spacer{margin-top:25px}.empty-state{grid-column:1/-1;padding:40px;text-align:center;color:var(--muted)} @media(max-width:1100px){.user-card-grid{grid-template-columns:1fr}.user-card-actions{grid-template-columns:repeat(2,1fr)}.permission-group-grid{grid-template-columns:repeat(2,1fr)}} @media(max-width:640px){.users-heading{display:block}.users-heading .button{margin-top:12px;width:100%}.user-stat-grid{grid-template-columns:1fr 1fr}.user-stat-grid .user-stat:last-child{grid-column:1/-1}.user-tools{display:block}.user-search{margin-top:12px}.user-card-grid{padding:11px}.user-meta-grid{grid-template-columns:1fr}.user-card-actions{grid-template-columns:1fr 1fr}.user-modal-card{inset:0;border-radius:0}.user-form-scroll{padding:11px}.user-fields{grid-template-columns:1fr}.role-card-grid,.permission-group-grid{grid-template-columns:1fr}.permission-title,.permission-toolbar{display:block}.permission-title>div:last-child,.permission-toolbar>div:last-child{margin-top:10px}.access-grid{padding:11px}.user-card-top{align-items:flex-start}.status-chip{font-size:8px}.access-heading .button{width:100%}} /* Owner wizard standard */ .owner-wizard-content{display:flex;flex:1;min-width:0;flex-direction:column}.owner-wizard-content>.owner-tab-panel{flex:1}.owner-tab{display:flex;align-items:center;gap:10px}.owner-tab .step-no{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#e2e8f0;color:#475569;flex:0 0 auto}.owner-tab.active .step-no,.owner-tab.done .step-no{background:#0f766e;color:#fff}.owner-tab.done{color:#0f766e}.owner-wizard-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 20px;border-top:1px solid var(--line);background:#fff}.wizard-actions-main{display:flex;align-items:center;gap:10px}.wizard-progress{color:var(--muted);font-size:12px;min-width:90px;text-align:center}.required-field{position:relative}.required-field::before{content:'*';color:#dc2626;font-weight:900;margin-left:4px}.wizard-submit[hidden],.wizard-next[hidden],.wizard-prev[hidden]{display:none!important} @media(max-width:900px){.owner-wizard-content{min-height:540px}.owner-wizard-actions{position:sticky;bottom:0;z-index:5}.owner-tab .step-no{width:24px;height:24px}.owner-tab{gap:6px}} @media(max-width:640px){.owner-wizard-actions{flex-direction:column-reverse;align-items:stretch}.wizard-actions-main{display:grid;grid-template-columns:1fr auto 1fr}.wizard-progress{min-width:0}.wizard-cancel{width:100%}} /* Phase 4 notifications */ .notification-bell{position:relative;text-decoration:none;font-size:1.2rem} .notification-count{position:absolute;top:-.45rem;right:-.45rem;background:#b91c1c;color:white;border-radius:999px;min-width:1.25rem;padding:0 .2rem;font:700 .72rem/1.25rem sans-serif;text-align:center} .notice-list{display:grid;gap:1rem}.notice-card{padding:1rem;border:1px solid #d4e5e0;border-radius:14px;background:white} .notice-card.unread{border-inline-start:5px solid #0f766e}.notice-card p{white-space:pre-wrap} .notice-form{display:grid;gap:1rem;max-width:720px}.notice-form label{display:grid;gap:.4rem}.notice-form input,.notice-form textarea,.notice-form select{max-width:100%;padding:.65rem;border:1px solid #cbd5d1;border-radius:8px} .notice-scroll{overflow:auto}.notice-scroll table{width:100%;min-width:680px} .notice-form input[type=checkbox]{width:18px;height:18px;accent-color:#0f766e}.notice-form select[multiple]{min-height:160px}.notice-card form{margin-top:.7rem}.notice-card h3{margin:.2rem 0} #installApp[hidden]{display:none!important} /* ===== design-system.css ===== */ :root{ --ds-primary:#0f766e;--ds-primary-hover:#0b5f59;--ds-primary-soft:#e8f7f5; --ds-bg:#f4f7fb;--ds-surface:#fff;--ds-surface-alt:#f8fafc;--ds-border:#dbe4ef; --ds-text:#142033;--ds-muted:#64748b;--ds-danger:#b42318;--ds-danger-soft:#fff0ee; --ds-success:#087a55;--ds-success-soft:#e9fbf3;--ds-warning:#9a6700;--ds-warning-soft:#fff8db; --ds-radius-sm:10px;--ds-radius-md:16px;--ds-radius-lg:24px; --ds-shadow:0 12px 32px rgba(15,23,42,.08);--ds-content-max:1540px; --ds-space-1:4px;--ds-space-2:8px;--ds-space-3:12px;--ds-space-4:16px;--ds-space-5:20px;--ds-space-6:24px;--ds-space-8:32px; --ds-control-h:46px;--ds-transition:160ms ease; } *{box-sizing:border-box}.page-content{width:100%;max-width:var(--ds-content-max);margin-inline:auto;padding:var(--ds-space-6)} .panel,.ds-card{background:var(--ds-surface);border:1px solid var(--ds-border);border-radius:var(--ds-radius-lg);box-shadow:var(--ds-shadow)} .panel{padding:var(--ds-space-6)}.panel-head,.ds-page-header{display:flex;align-items:center;justify-content:space-between;gap:var(--ds-space-4);margin-bottom:var(--ds-space-5)} .ds-page-header h1,.users-heading h1{margin:0;color:var(--ds-text);font-size:clamp(1.45rem,2.4vw,2rem)} .ds-page-header p,.users-heading p,.panel-head p{color:var(--ds-muted);margin:.35rem 0 0} .button,button,input,select,textarea{font:inherit}.button,button{min-height:42px;border-radius:var(--ds-radius-sm);transition:all var(--ds-transition)} .button.primary,button.primary{background:var(--ds-primary);color:#fff;border-color:var(--ds-primary)}.button.primary:hover,button.primary:hover{background:var(--ds-primary-hover)} .button.secondary,button.secondary{background:var(--ds-surface-alt);color:var(--ds-text);border:1px solid var(--ds-border)} .button.danger,button.danger,.ghost-danger{color:var(--ds-danger);background:var(--ds-danger-soft);border:1px solid #ffc9c3} label{color:var(--ds-text);font-weight:600}input,select,textarea{width:100%;min-height:var(--ds-control-h);border:1px solid var(--ds-border);border-radius:var(--ds-radius-sm);background:#fff;color:var(--ds-text);padding:10px 13px;outline:none;transition:border-color var(--ds-transition),box-shadow var(--ds-transition)} textarea{min-height:110px;resize:vertical}input:focus,select:focus,textarea:focus{border-color:var(--ds-primary);box-shadow:0 0 0 3px rgba(15,118,110,.12)} input.is-invalid{border-color:var(--ds-danger);box-shadow:0 0 0 3px rgba(180,35,24,.1)} .field-error{display:block;color:var(--ds-danger);font-size:.78rem;margin-top:5px;font-weight:500}.date-field{position:relative}.date-field input{padding-left:42px}.date-field::after{content:'⌗';position:absolute;left:14px;bottom:13px;color:var(--ds-muted);pointer-events:none} .flash{border-radius:var(--ds-radius-md);padding:13px 16px;margin-bottom:var(--ds-space-4)}.flash.success{background:var(--ds-success-soft);color:var(--ds-success)}.flash.danger{background:var(--ds-danger-soft);color:var(--ds-danger)} .status-chip,.ds-badge{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:5px 10px;border-radius:999px;font-size:.78rem;font-weight:700} .table-wrap{overflow:auto;border:1px solid var(--ds-border);border-radius:var(--ds-radius-md)}table{width:100%;border-collapse:collapse}th{background:var(--ds-surface-alt);color:var(--ds-muted);font-size:.82rem}th,td{padding:13px 14px;border-bottom:1px solid var(--ds-border);text-align:right}.actions{display:flex;gap:8px;flex-wrap:wrap}.actions form{margin:0} .empty-state{border:1px dashed #cbd5e1;border-radius:var(--ds-radius-md);padding:30px;text-align:center;color:var(--ds-muted);background:var(--ds-surface-alt)} .form-grid,.owner-form-grid,.user-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--ds-space-4)}.wide{grid-column:1/-1} @media(max-width:760px){.page-content{padding:14px}.panel{padding:16px;border-radius:18px}.panel-head,.ds-page-header,.users-heading{align-items:stretch;flex-direction:column}.form-grid,.owner-form-grid,.user-fields{grid-template-columns:1fr}.wide{grid-column:auto}.button,button{min-height:44px}.table-wrap.mobile-cards{border:0;overflow:visible}.table-wrap.mobile-cards table,.table-wrap.mobile-cards tbody{display:block}.table-wrap.mobile-cards thead{display:none}.table-wrap.mobile-cards tr{display:block;background:#fff;border:1px solid var(--ds-border);border-radius:16px;padding:10px 14px;margin-bottom:12px;box-shadow:0 5px 18px rgba(15,23,42,.05)}.table-wrap.mobile-cards td{display:flex;justify-content:space-between;gap:16px;border:0;padding:8px 0;text-align:left}.table-wrap.mobile-cards td::before{content:attr(data-label);font-weight:700;color:var(--ds-muted);text-align:right}.table-wrap.mobile-cards td.actions{justify-content:flex-start;padding-top:12px;border-top:1px solid var(--ds-border)}.table-wrap.mobile-cards td.actions::before{display:none}.actions .button,.actions button{flex:1}} .login-type-switch{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:8px}.login-type-switch label{position:relative}.login-type-switch input{position:absolute;opacity:0;pointer-events:none}.login-type-switch span{display:flex;align-items:center;justify-content:center;min-height:46px;border:1px solid var(--ds-border);border-radius:12px;background:var(--ds-surface-alt);cursor:pointer}.login-type-switch input:checked+span{background:var(--ds-primary-soft);border-color:var(--ds-primary);color:var(--ds-primary);box-shadow:0 0 0 3px rgba(15,118,110,.08)} .rate-summary{background:linear-gradient(135deg,var(--ds-primary-soft),#fff);border:1px solid #bce7e1;border-radius:16px;padding:16px;margin-bottom:18px}.rate-summary div{display:flex;gap:12px;flex-wrap:wrap;align-items:center}.rate-summary span{font-weight:800;color:var(--ds-primary);margin-left:auto}.rate-summary b{background:#fff;border:1px solid var(--ds-border);padding:8px 12px;border-radius:10px} .account-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.account-card{display:flex;gap:16px;align-items:center;text-decoration:none;color:var(--ds-text);background:#fff;border:1px solid var(--ds-border);border-radius:20px;padding:20px;box-shadow:var(--ds-shadow);transition:.18s}.account-card:hover{transform:translateY(-2px);border-color:#9fd6cf}.account-main{flex:1}.account-main h3{margin:0 0 5px}.account-main p{margin:0 0 14px;color:var(--ds-muted)}.account-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.account-metrics span{background:var(--ds-surface-alt);padding:9px;border-radius:10px;font-size:.8rem}.account-metrics b{display:block;margin-top:4px}.account-metrics .debt{background:var(--ds-danger-soft);color:var(--ds-danger)}.account-metrics .credit{background:var(--ds-success-soft);color:var(--ds-success)}.charge-stats{grid-template-columns:repeat(3,minmax(0,1fr))} button:disabled{opacity:.55;cursor:not-allowed} @media(max-width:760px){.login-type-switch{grid-template-columns:1fr}.account-grid{grid-template-columns:1fr}.account-metrics{grid-template-columns:1fr}.charge-stats{grid-template-columns:1fr}.rate-summary div{display:grid}.rate-summary span{margin-left:0}} /* ورودی استاندارد تاریخ شمسی */ .jalali-date-input{direction:ltr!important;text-align:left!important;unicode-bidi:plaintext;font-variant-numeric:tabular-nums;letter-spacing:.04em;font-family:inherit} select.is-invalid,textarea.is-invalid{border-color:var(--ds-danger);box-shadow:0 0 0 3px rgba(180,35,24,.1)} /* کامپوننت مرکزی تاریخ شمسی؛ کمبوی جست‌وجودار سراسری */ .jalali-date-value{display:none!important} .jalali-combo{display:grid;grid-template-columns:92px 154px 72px;gap:7px;direction:ltr;width:max-content;max-width:100%;align-items:center} .jalali-search-combo{position:relative;min-width:0} .jalali-search-combo input{width:100%;margin:0;min-width:0;text-align:center;padding:8px 9px;background:#fff;direction:rtl;font-variant-numeric:tabular-nums} .jalali-search-combo input.is-complete{border-color:var(--ds-primary);box-shadow:0 0 0 3px rgba(15,118,110,.10)} .jalali-search-combo input::placeholder{color:#94a3b8} .jalali-year-wrap{width:92px}.jalali-month-wrap{width:154px}.jalali-day-wrap{width:72px} .jalali-month{font-size:.9rem} .jalali-combo.is-invalid input{border-color:var(--ds-danger);box-shadow:0 0 0 3px rgba(180,35,24,.1)} .jalali-combo input:focus{position:relative;z-index:2} .date-field::after{display:none!important} .date-field .jalali-combo{margin-top:0} /* هر ورودی دارای data-jalali-date در هر صفحه، خودکار همین استاندارد را می‌گیرد. */ @media(max-width:520px){ .jalali-combo{grid-template-columns:minmax(78px,.8fr) minmax(132px,1.35fr) minmax(64px,.65fr);width:100%;gap:5px} .jalali-year-wrap,.jalali-month-wrap,.jalali-day-wrap{width:auto} .jalali-search-combo input{padding-inline:5px;font-size:.86rem} } /* تایپوگرافی مرکزی ShareHome */ html,body,button,input,select,textarea,.button{ font-family:"Yekan","B Yekan","IRYekan",Tahoma,"Segoe UI",Arial,sans-serif!important; } h1,h2,h3,h4,h5,h6,.topbar-title b,.panel-head h2,.section-title b,.page-heading h1,.hero-panel h1,.auth-card h2,.showcase-content h1{ font-family:"Titr","B Titr","IR Titr",Tahoma,"Segoe UI",Arial,sans-serif!important; font-weight:700; } /* Opening balance for special turns */ .opening-entry-card{border:1px solid var(--border,#d9e2ec);border-radius:16px;padding:14px 16px;background:rgba(15,118,110,.04)} .switch-row{display:flex!important;align-items:flex-start;gap:12px;cursor:pointer;margin:0!important} .switch-row input{width:20px;height:20px;margin-top:2px;accent-color:#0f766e;flex:0 0 auto} .switch-row span{display:flex;flex-direction:column;gap:4px}.switch-row b{font-size:15px}.switch-row small{color:var(--muted,#64748b);line-height:1.8} .opening-special-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px;padding-top:14px;border-top:1px dashed var(--border,#d9e2ec)} .opening-special-fields[hidden]{display:none!important}.field-help{grid-column:1/-1;margin:0}.danger-text{color:#b42318} .transfer-form{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.transfer-form select{min-width:170px} @media(max-width:760px){.opening-special-fields{grid-template-columns:1fr}.transfer-form{align-items:stretch}.transfer-form select,.transfer-form button{width:100%}} /* Period exchange market */ .exchange-help-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:14px} .exchange-help-grid>div{padding:16px;border:1px solid var(--border,#dbe3e6);border-radius:16px;background:var(--surface-soft,#f8fafc);display:flex;flex-direction:column;gap:6px} .exchange-help-grid b{font-family:var(--font-title,"Titr",sans-serif);font-size:1.05rem} .exchange-help-grid span{color:var(--muted,#64748b);line-height:1.9} .exchange-card-top{display:flex;align-items:center;justify-content:space-between;gap:10px} .exchange-card-top small{font-weight:700;color:var(--muted,#64748b)} .exchange-note{padding:10px 12px;border-radius:12px;background:#f1f5f9;margin:10px 0;line-height:1.8} .exchange-owner-state{padding:10px 12px;border-radius:12px;background:#ecfeff;color:#155e75;font-weight:700;margin:10px 0} .request-list{display:grid;gap:14px} .request-card{border:1px solid var(--border,#dbe3e6);border-radius:18px;padding:16px;background:#fff;display:grid;gap:12px} .request-card>div:first-child{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.request-card>div:first-child span{color:var(--muted,#64748b)} .request-card small{display:block;color:var(--muted,#64748b)} .swap-preview{padding:12px;border-radius:14px;background:#f8fafc;display:grid;gap:4px} .inline-actions{display:flex;flex-wrap:wrap;gap:10px}.inline-actions form{margin:0} .status-chip{display:inline-flex;width:max-content;padding:6px 10px;border-radius:999px;font-weight:700;background:#f1f5f9}.status-chip.pending{background:#fff7ed;color:#9a3412}.status-chip.approved{background:#ecfdf5;color:#166534}.status-chip.rejected,.status-chip.cancelled{background:#fef2f2;color:#991b1b} .button-danger{background:#b91c1c!important}.button-secondary{background:#475569!important} @media(max-width:760px){.exchange-help-grid{grid-template-columns:1fr}.inline-actions,.inline-actions form,.inline-actions button{width:100%}} /* Global font size boost */ html{font-size:18px;} body{font-size:1.125rem;} input,select,textarea,button,.btn,.form-control,.form-select{font-size:1.125rem!important;} label,.card,.table,small,.small{font-size:1.05rem!important;} h1{font-size:3rem!important;} h2{font-size:2.5rem!important;} h3{font-size:2.1rem!important;} h4{font-size:1.8rem!important;} h5{font-size:1.55rem!important;} h6{font-size:1.35rem!important;} .nav-link,.sidebar a,.menu-item,.stat-value,.stat-title,.page-title,.section-title{font-size:1.2rem!important;} /* ShareHome v32: increase all secondary/caption text by roughly two visual sizes */ :root{ --ds-caption-size:13px; --ds-small-size:14px; --ds-secondary-size:15px; } /* Global secondary copy, hints and captions */ small, .form-hint, .field-help, .field-error, .topbar-title small, .brand span, .user-panel small, .nav-caption, .stat-card span, .stat-card small, .panel-head p, .panel-head > a, .owner-name small, .progress-meta, .donut span, .legend p, .period-type, .period-card p, .form-grid label, .auth-form label, .form-divider, .section-title span, .account-existing span, .account-existing small, .owner-profile-stats span, .info-grid span, .user-stat span, .user-stat small, .user-role-row span, .user-meta-grid span, .user-modal-card > header p, .role-card small, .permission-group > label, .permission-toolbar span, .group-toggle, .wizard-progress, .eyebrow{ font-size:var(--ds-caption-size)!important; line-height:1.75; } /* Slightly more important secondary values */ .user-panel b, .role-badge, .button, .status-chip, .ds-badge, .user-role-row b, .user-meta-grid b, .info-grid b, .account-metrics span, th, .field-error{ font-size:var(--ds-small-size)!important; } /* Descriptions under page and section titles */ .ds-page-header p, .users-heading p, .page-heading p, .hero-panel p, .owner-profile-id p, .manager-note, .account-main p{ font-size:var(--ds-secondary-size)!important; line-height:1.9; } /* Preserve comfortable size on mobile instead of shrinking captions again */ @media(max-width:640px){ .status-chip, .ds-badge, .jalali-search-combo input{ font-size:var(--ds-small-size)!important; } } /* ShareHome v33: balanced headings, modern login and global waiting overlay */ :root{ --ds-heading-1:2.35rem; --ds-heading-2:1.95rem; --ds-heading-3:1.65rem; --ds-heading-4:1.4rem; --ds-heading-5:1.22rem; --ds-heading-6:1.1rem; } h1{font-size:var(--ds-heading-1)!important;line-height:1.45} h2{font-size:var(--ds-heading-2)!important;line-height:1.5} h3{font-size:var(--ds-heading-3)!important;line-height:1.55} h4{font-size:var(--ds-heading-4)!important;line-height:1.6} h5{font-size:var(--ds-heading-5)!important;line-height:1.65} h6{font-size:var(--ds-heading-6)!important;line-height:1.7} .showcase-content h1{font-size:clamp(2rem,3.2vw,3.05rem)!important;line-height:1.55} .auth-card h2{font-size:clamp(1.75rem,2.2vw,2.15rem)!important} .hero-panel h1,.page-heading h1,.users-heading h1,.ds-page-header h1{font-size:clamp(1.85rem,2.7vw,2.45rem)!important} .panel-head h2{font-size:1.55rem!important} /* Modern login */ .auth-page{background:linear-gradient(135deg,#f8fbfc 0%,#eef7f6 100%);min-height:100svh} .auth-showcase{background: radial-gradient(circle at 18% 22%,rgba(45,212,191,.19),transparent 27%), radial-gradient(circle at 82% 82%,rgba(255,255,255,.08),transparent 32%), linear-gradient(145deg,#082f34 0%,#075e58 48%,#0f766e 100%);padding:clamp(42px,6vw,88px)} .auth-showcase:before{width:520px;height:520px;border-color:rgba(255,255,255,.11)} .auth-showcase:after{width:300px;height:300px;border-color:rgba(255,255,255,.1)} .showcase-content{max-width:640px} .showcase-content .brand-mark.jumbo{width:72px;height:72px;border-radius:22px;font-size:1.35rem;box-shadow:0 20px 50px rgba(45,212,191,.28)} .showcase-content p{font-size:1.05rem!important;line-height:2;max-width:590px} .feature-pills{gap:12px}.feature-pills span{padding:11px 15px;font-size:.9rem!important;background:rgba(255,255,255,.09);backdrop-filter:blur(7px)} .auth-form-wrap{padding:clamp(24px,5vw,64px);position:relative} .auth-card{width:min(470px,100%);background:rgba(255,255,255,.94);border:1px solid rgba(203,213,225,.72);border-radius:28px;padding:clamp(25px,3.5vw,42px);box-shadow:0 26px 80px rgba(15,23,42,.13);backdrop-filter:blur(14px)} .auth-card>p{font-size:1rem!important;margin-bottom:0}.auth-form{margin-top:28px;gap:18px} .login-type-switch{background:#f1f5f9;padding:5px;border-radius:15px;gap:5px} .login-type-switch span{border:0;background:transparent;min-height:50px;border-radius:11px;font-weight:800} .login-type-switch input:checked+span{background:#fff;border:1px solid #99d8d2;box-shadow:0 7px 20px rgba(15,118,110,.12)} .auth-form label{font-size:.95rem!important;gap:9px} .input-icon input{height:54px;border-radius:14px;background:#f8fafc;border-color:#dbe5ec;padding-right:44px} .input-icon input:focus{background:#fff}.input-icon span{right:15px;font-size:1.05rem} .auth-form .button{height:54px;border-radius:14px;font-size:1rem!important;box-shadow:0 13px 28px rgba(15,118,110,.2)} .login-note{font-size:.8rem!important;background:#f8fafc;border:1px dashed #d6e0e8;border-radius:12px;padding:10px 12px;margin:18px 0 0!important} .login-copyright{text-align:center;color:var(--ds-muted);font-size:.82rem!important;line-height:1.9;margin:18px 0 0;padding-top:16px;border-top:1px solid #eef2f7} .mobile-brand b{font-size:1.1rem}.auth-card .eyebrow{display:inline-flex;align-items:center;gap:7px;background:var(--ds-primary-soft);padding:7px 11px;border-radius:999px;letter-spacing:0;color:var(--ds-primary)} @media(max-width:900px){.auth-form-wrap{min-height:100svh}.auth-card{margin:auto}.mobile-brand{display:flex}} @media(max-width:640px){.auth-card{border-radius:22px;padding:24px 19px}.auth-form-wrap{padding:18px}.auth-card h2{font-size:1.75rem!important}} /* Global server-wait overlay */ .global-wait-overlay{position:fixed;inset:0;z-index:99999;display:grid;place-items:center;background:rgba(8,30,35,.48);backdrop-filter:blur(5px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s ease,visibility .18s ease} .global-wait-overlay.is-visible{opacity:1;visibility:visible;pointer-events:all} .global-wait-card{min-width:min(330px,calc(100vw - 34px));background:rgba(255,255,255,.97);border:1px solid rgba(255,255,255,.8);border-radius:22px;padding:25px 28px;box-shadow:0 28px 80px rgba(2,25,29,.28);display:flex;align-items:center;gap:17px;color:var(--ds-text)} .global-wait-spinner{width:48px;height:48px;flex:0 0 auto;border-radius:50%;border:4px solid #d8efec;border-top-color:var(--ds-primary);animation:sharehome-spin .78s linear infinite} .global-wait-copy b{display:block;font-size:1.08rem;margin-bottom:5px}.global-wait-copy span{display:block;color:var(--ds-muted);font-size:.9rem;line-height:1.7} body.is-waiting{cursor:progress}.is-action-pending{pointer-events:none!important;opacity:.7!important} @keyframes sharehome-spin{to{transform:rotate(360deg)}} @media(prefers-reduced-motion:reduce){.global-wait-spinner{animation-duration:1.6s}} /* ShareHome v34: Razavi dashboard and modern owner panel */ .razavi-banner{position:relative;min-height:285px;border-radius:30px;overflow:hidden;color:#fff;box-shadow:0 24px 64px rgba(2,44,50,.2);isolation:isolate;margin-bottom:20px} .razavi-banner>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:-3;transform:scale(1.015)} .razavi-banner-shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,rgba(3,31,36,.96) 0%,rgba(4,53,56,.87) 48%,rgba(5,67,69,.48) 100%)} .razavi-banner:after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 82% 18%,rgba(251,191,36,.22),transparent 25%),linear-gradient(180deg,transparent 40%,rgba(0,0,0,.28))} .razavi-banner-content{max-width:880px;padding:clamp(30px,4.5vw,58px);display:flex;flex-direction:column;justify-content:center;min-height:285px} .razavi-kicker{display:inline-flex;width:max-content;padding:7px 12px;border:1px solid rgba(255,255,255,.2);border-radius:999px;background:rgba(255,255,255,.08);backdrop-filter:blur(8px);font-weight:800;font-size:.86rem!important;color:#fef3c7} .razavi-banner h1{margin:14px 0 10px;font-size:clamp(1.75rem,3vw,2.55rem)!important;color:#fff;text-shadow:0 3px 14px rgba(0,0,0,.22)} .razavi-banner p{margin:0;max-width:820px;font-size:clamp(.9rem,1.25vw,1.04rem)!important;line-height:2.15;color:rgba(255,255,255,.9);text-align:justify} .razavi-photo-credit{position:absolute;left:16px;bottom:10px;color:rgba(255,255,255,.58);font-size:.64rem!important;direction:ltr} .dashboard-commandbar{display:flex;align-items:center;justify-content:space-between;gap:24px;background:linear-gradient(135deg,#fff,#f8fbfc);border:1px solid var(--ds-border);border-radius:22px;padding:20px 22px;box-shadow:0 10px 30px rgba(15,23,42,.055);margin-bottom:18px} .dashboard-commandbar h2{margin:5px 0 4px;font-size:1.45rem!important}.dashboard-commandbar p{margin:0;color:var(--ds-muted);font-size:.92rem!important} .dashboard-quick-actions{display:flex;gap:9px;flex-wrap:wrap}.button.soft{background:#ecfeff;color:#0e7490;border:1px solid #bae6fd} .modern-stats .stat-card{position:relative;overflow:hidden;min-height:124px;border-radius:22px;padding:20px;transition:transform .18s ease,box-shadow .18s ease} .modern-stats .stat-card:hover{transform:translateY(-3px);box-shadow:0 18px 42px rgba(15,23,42,.09)} .modern-stats .stat-card:after{content:"";position:absolute;width:95px;height:95px;border-radius:50%;background:rgba(15,118,110,.035);left:-35px;bottom:-42px} .modern-stats .stat-icon{width:54px;height:54px;border-radius:17px}.modern-stats .stat-card strong{font-size:1.6rem!important} .modern-dashboard-grid{grid-template-columns:minmax(0,1.9fr) minmax(290px,.8fr)} .dashboard-main-panel,.dashboard-side-panel,.latest-periods-panel{border-radius:24px;background:linear-gradient(180deg,#fff,#fbfdff)} .panel-kicker{display:block;color:var(--ds-primary);font-weight:800;font-size:.74rem!important;margin-bottom:5px} .dashboard-main-panel .owner-progress{padding:15px 0}.dashboard-main-panel .owner-progress:first-child{padding-top:2px} .dashboard-side-panel .donut-wrap{min-height:285px;display:flex;flex-direction:column;justify-content:center} .modern-period-cards{gap:14px}.modern-period-cards .period-card{border-radius:20px;padding:18px;box-shadow:0 8px 22px rgba(15,23,42,.045);transition:transform .18s ease,border-color .18s ease} .modern-period-cards .period-card:hover{transform:translateY(-3px);border-color:#99d8d2}.period-card-top{display:flex;align-items:center;justify-content:space-between} .status-dot{width:9px;height:9px;border-radius:50%;box-shadow:0 0 0 5px rgba(15,118,110,.08)}.status-dot.free{background:#10b981}.status-dot.allocated{background:#3b82f6} @media(max-width:1000px){.dashboard-commandbar{align-items:flex-start;flex-direction:column}.modern-dashboard-grid{grid-template-columns:1fr}.razavi-banner-content{max-width:100%}} @media(max-width:640px){.razavi-banner{min-height:330px;border-radius:22px}.razavi-banner-content{padding:24px 20px;min-height:330px}.razavi-banner p{line-height:2;font-size:.86rem!important}.razavi-photo-credit{font-size:.52rem!important}.dashboard-commandbar{padding:17px}.dashboard-quick-actions{display:grid;grid-template-columns:1fr;width:100%}.dashboard-quick-actions .button{width:100%}.modern-stats .stat-card{min-height:112px}.modern-dashboard-grid{display:block}.dashboard-side-panel{margin-top:14px}} /* ShareHome v35: property/suite settings, fair suite lottery, refined Razavi banner */ .razavi-banner{display:grid!important;grid-template-columns:minmax(0,1fr) 280px;gap:14px;background:transparent!important;min-height:0!important;box-shadow:none!important;overflow:visible!important;isolation:auto!important} .razavi-banner-main{position:relative;min-height:285px;border-radius:30px;overflow:hidden;color:#fff;box-shadow:0 24px 64px rgba(2,44,50,.2);isolation:isolate} .razavi-banner-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:-3;transform:scale(1.015)} .razavi-side-photo{margin:0;min-height:285px;border-radius:30px;overflow:hidden;box-shadow:0 24px 64px rgba(2,44,50,.16);background:#0b3438} .razavi-side-photo img{width:100%;height:100%;min-height:285px;display:block;object-fit:cover;object-position:68% center;transform:scale(1.08)} .razavi-banner h1{font-size:clamp(1.25rem,2vw,1.75rem)!important;margin:12px 0 8px} .razavi-photo-credit{display:none!important} .sidebar-nav a{font-size:calc(1rem - 1px)!important} .settings-modern-card{max-width:900px}.settings-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.settings-grid .form-divider,.settings-grid .form-hint,.settings-grid button{grid-column:1/-1} .suite-badge{display:inline-flex;padding:4px 9px;border-radius:999px;background:#ecfeff;color:#0f766e;border:1px solid #a5f3fc;font-size:.72rem;font-weight:800;margin-bottom:7px} @media(max-width:1050px){.razavi-banner{grid-template-columns:1fr 220px}.razavi-side-photo,.razavi-side-photo img{min-height:285px}} @media(max-width:760px){.razavi-banner{grid-template-columns:1fr}.razavi-side-photo{display:none}.razavi-banner-main{min-height:330px}.settings-grid{grid-template-columns:1fr}.settings-grid>*{grid-column:1!important}} \n\n/* ShareHome v36: single full-width Razavi hero */\n.razavi-banner{\n display:block!important;\n position:relative!important;\n min-height:300px!important;\n margin-bottom:20px!important;\n border-radius:30px!important;\n overflow:hidden!important;\n background:#062f34!important;\n box-shadow:0 24px 64px rgba(2,44,50,.2)!important;\n isolation:isolate!important;\n}\n.razavi-banner-main{\n position:relative;\n width:100%;\n min-height:300px;\n border-radius:0!important;\n overflow:hidden;\n box-shadow:none!important;\n isolation:isolate;\n}\n.razavi-banner-bg{\n position:absolute;\n inset:0;\n width:100%;\n height:100%;\n object-fit:cover;\n object-position:center 46%;\n transform:none!important;\n z-index:-3;\n}\n.razavi-banner-shade{\n position:absolute;\n inset:0;\n z-index:-2;\n background:linear-gradient(90deg,rgba(2,27,31,.92) 0%,rgba(3,42,46,.74) 48%,rgba(2,30,33,.52) 100%)!important;\n}\n.razavi-banner-main:after{\n content:"";\n position:absolute;\n inset:0;\n z-index:-1;\n background:linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.28));\n}\n.razavi-banner-content{\n max-width:980px;\n min-height:300px;\n padding:clamp(28px,4vw,52px);\n display:flex;\n flex-direction:column;\n justify-content:center;\n}\n.razavi-banner h1{\n margin:12px 0 8px!important;\n font-size:clamp(1.12rem,1.65vw,1.55rem)!important;\n line-height:1.75!important;\n}\n.razavi-banner p{\n max-width:900px;\n font-size:clamp(.86rem,1.05vw,.98rem)!important;\n line-height:2.15!important;\n}\n.razavi-side-photo{display:none!important}\n@media(max-width:760px){\n .razavi-banner,.razavi-banner-main{min-height:340px!important}\n .razavi-banner-content{min-height:340px;padding:24px 20px}\n .razavi-banner-bg{object-position:center center}\n .razavi-banner h1{font-size:1.18rem!important}\n}\n /* ShareHome v38: approved full-width Razavi banner */ .razavi-banner-v38{ position:relative!important; display:grid!important; grid-template-columns:minmax(300px,31%) minmax(0,69%)!important; width:100%!important; min-height:330px!important; margin:0 0 20px!important; border-radius:28px!important; overflow:hidden!important; background:linear-gradient(135deg,#062f35 0%,#073f43 55%,#05292f 100%)!important; box-shadow:0 22px 56px rgba(2,44,50,.18)!important; isolation:isolate!important; border:1px solid rgba(205,158,61,.28)!important; } .razavi-banner-v38:before, .razavi-banner-v38:after{ content:""; position:absolute; width:48px; height:48px; z-index:4; pointer-events:none; opacity:.95; } .razavi-banner-v38:before{ top:12px;right:12px; border-top:3px solid #d9ad4b; border-right:3px solid #d9ad4b; border-radius:0 13px 0 0; } .razavi-banner-v38:after{ bottom:12px;left:12px; border-bottom:3px solid #d9ad4b; border-left:3px solid #d9ad4b; border-radius:0 0 0 13px; } .razavi-shrine-panel{ position:relative; min-height:330px; overflow:hidden; background:#071f2d; } .razavi-shrine-panel:after{ content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(5,41,47,.05),rgba(5,41,47,.02) 68%,rgba(5,41,47,.58)); pointer-events:none; } .razavi-shrine-panel img{ display:block; width:100%; height:100%; min-height:330px; object-fit:cover; object-position:center 42%; filter:saturate(1.06) contrast(1.03); } .razavi-prayer-panel{ position:relative; min-height:330px; display:flex; flex-direction:column; justify-content:center; align-items:center; padding:34px clamp(28px,4vw,64px) 30px; text-align:center; color:#fff; background: radial-gradient(circle at 50% 42%,rgba(255,255,255,.055),transparent 42%), linear-gradient(135deg,rgba(4,57,61,.98),rgba(3,38,44,.98)); } .razavi-prayer-panel:before{ content:""; position:absolute; top:-7%; bottom:-7%; right:-24px; width:52px; background:#d8aa43; border-radius:48% 52% 47% 53% / 8% 11% 89% 92%; box-shadow:-8px 0 0 rgba(255,229,160,.25); z-index:3; } .razavi-prayer-panel .razavi-kicker{ display:inline-flex; align-items:center; justify-content:center; width:max-content; margin:0 auto 12px; padding:7px 16px; border:1px solid rgba(222,177,79,.78); border-radius:10px; background:rgba(2,33,38,.55); color:#f7d77d; font-size:.86rem!important; font-weight:800; box-shadow:inset 0 0 0 1px rgba(255,255,255,.04); } .razavi-banner-v38 h1{ margin:0 0 12px!important; color:#f5d273!important; font-size:clamp(1rem,1.25vw,1.28rem)!important; line-height:1.8!important; text-shadow:0 2px 10px rgba(0,0,0,.28); } .razavi-banner-v38 .razavi-calligraphy{ max-width:930px; margin:0!important; color:#fffdf6!important; font-family:"Titr","B Titr","Yekan","B Yekan",Tahoma,sans-serif!important; font-size:clamp(1.08rem,1.55vw,1.62rem)!important; font-weight:700; line-height:2.15!important; text-align:center!important; text-shadow:0 2px 11px rgba(0,0,0,.38); } .razavi-ornament{ display:flex; align-items:center; justify-content:center; gap:9px; width:42%; margin-top:14px; color:#d9ad4b; font-size:.9rem; } .razavi-ornament:before,.razavi-ornament:after{ content:""; height:1px; flex:1; background:linear-gradient(90deg,transparent,#d9ad4b); } .razavi-ornament:after{background:linear-gradient(90deg,#d9ad4b,transparent)} @media(max-width:900px){ .razavi-banner-v38{grid-template-columns:260px minmax(0,1fr)!important;min-height:300px!important} .razavi-shrine-panel,.razavi-shrine-panel img,.razavi-prayer-panel{min-height:300px} .razavi-prayer-panel{padding:26px 26px 24px} .razavi-banner-v38 .razavi-calligraphy{font-size:1.02rem!important;line-height:2.05!important} } @media(max-width:680px){ .razavi-banner-v38{grid-template-columns:1fr!important;border-radius:22px!important} .razavi-shrine-panel{min-height:210px} .razavi-shrine-panel img{min-height:210px;height:210px;object-position:center 38%} .razavi-shrine-panel:after{background:linear-gradient(180deg,transparent 55%,rgba(5,41,47,.82))} .razavi-prayer-panel{min-height:0;padding:25px 18px 27px} .razavi-prayer-panel:before{display:none} .razavi-banner-v38 .razavi-calligraphy{font-size:.91rem!important;line-height:2!important} .razavi-ornament{width:70%} } /* ShareHome v39: final approved Razavi banner */ .razavi-banner-v39{ direction:ltr!important; display:grid!important; grid-template-columns:minmax(300px,31%) minmax(0,69%)!important; width:100%!important; min-height:330px!important; margin:0 0 22px!important; border-radius:28px!important; overflow:hidden!important; position:relative!important; isolation:isolate!important; background:#052e33!important; border:1px solid rgba(220,174,72,.42)!important; box-shadow:0 20px 52px rgba(2,44,50,.18)!important; } .razavi-banner-v39:before, .razavi-banner-v39:after{ content:""; position:absolute; width:42px; height:42px; z-index:8; pointer-events:none; } .razavi-banner-v39:before{ top:12px;right:12px; border-top:3px solid #ddb348; border-right:3px solid #ddb348; border-radius:0 13px 0 0; } .razavi-banner-v39:after{ bottom:12px;left:12px; border-bottom:3px solid #ddb348; border-left:3px solid #ddb348; border-radius:0 0 0 13px; } .razavi-banner-v39 .razavi-shrine-panel{ grid-column:1; position:relative; min-width:0; min-height:330px; overflow:hidden; background:#071f2d; } .razavi-banner-v39 .razavi-shrine-panel:after{ content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(2,31,37,.04) 0%,rgba(2,31,37,.03) 70%,rgba(2,47,52,.5) 100%); pointer-events:none; } .razavi-banner-v39 .razavi-shrine-panel img{ display:block; width:100%; height:100%; min-height:330px; object-fit:cover; object-position:center center; filter:saturate(1.08) contrast(1.04); } .razavi-banner-v39 .razavi-prayer-panel{ grid-column:2; position:relative; min-width:0; min-height:330px; padding:32px clamp(28px,4vw,66px) 28px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; color:#fff; background: radial-gradient(circle at 50% 38%,rgba(255,255,255,.055),transparent 42%), linear-gradient(135deg,#073f43 0%,#052f35 58%,#041f27 100%); } .razavi-banner-v39 .razavi-prayer-panel:before{ content:""; position:absolute; top:-9%; bottom:-9%; left:-30px; width:62px; background:#deb247; clip-path:polygon(52% 0,100% 0,100% 100%,52% 100%,37% 92%,51% 82%,31% 70%,48% 58%,29% 46%,50% 34%,34% 21%,51% 10%); box-shadow:10px 0 0 rgba(255,231,168,.2); z-index:4; } .razavi-banner-v39 .razavi-kicker{ display:inline-flex; padding:7px 17px; margin-bottom:11px; border:1px solid rgba(226,181,79,.82); border-radius:10px; background:rgba(2,31,37,.56); color:#f6d676; font-size:.83rem!important; font-weight:800; white-space:nowrap; } .razavi-banner-v39 h1{ margin:0 0 12px!important; color:#f4cf69!important; font-size:clamp(.96rem,1.16vw,1.2rem)!important; line-height:1.7!important; white-space:nowrap; } .razavi-banner-v39 .razavi-calligraphy{ width:100%; max-width:980px; display:flex; flex-direction:column; align-items:center; gap:2px; margin:0!important; color:#fffdf7!important; font-family:"Titr","B Titr","Yekan","B Yekan",Tahoma,sans-serif!important; font-size:clamp(1.02rem,1.42vw,1.52rem)!important; font-weight:700; line-height:2.02!important; text-align:center!important; text-shadow:0 2px 10px rgba(0,0,0,.34); } .razavi-banner-v39 .razavi-calligraphy span{ display:block; width:100%; white-space:normal; } .razavi-banner-v39 .razavi-ornament{ display:flex; align-items:center; width:42%; margin-top:12px; color:#ddb348; } @media(max-width:1050px){ .razavi-banner-v39{grid-template-columns:minmax(245px,30%) minmax(0,70%)!important;min-height:300px!important} .razavi-banner-v39 .razavi-shrine-panel, .razavi-banner-v39 .razavi-shrine-panel img, .razavi-banner-v39 .razavi-prayer-panel{min-height:300px} .razavi-banner-v39 .razavi-prayer-panel{padding:25px 25px 23px} .razavi-banner-v39 .razavi-calligraphy{font-size:.98rem!important;line-height:1.95!important} } @media(max-width:720px){ .razavi-banner-v39{grid-template-columns:1fr!important;border-radius:22px!important} .razavi-banner-v39 .razavi-shrine-panel{grid-column:1;min-height:205px} .razavi-banner-v39 .razavi-shrine-panel img{min-height:205px;height:205px;object-position:center 40%} .razavi-banner-v39 .razavi-shrine-panel:after{background:linear-gradient(180deg,transparent 55%,rgba(5,47,53,.78))} .razavi-banner-v39 .razavi-prayer-panel{grid-column:1;min-height:0;padding:24px 18px 26px} .razavi-banner-v39 .razavi-prayer-panel:before{display:none} .razavi-banner-v39 h1{white-space:normal;font-size:1rem!important} .razavi-banner-v39 .razavi-calligraphy{font-size:.9rem!important;line-height:1.95!important} .razavi-banner-v39 .razavi-ornament{width:70%} } /* ShareHome v40: exact approved Razavi artwork banner */ .razavi-banner-static{ width:100%; margin:0 0 20px; border-radius:28px; overflow:hidden; background:#062f34; box-shadow:0 22px 58px rgba(2,44,50,.18); } .razavi-banner-static img{ display:block; width:100%; height:auto; aspect-ratio:1380/336; object-fit:cover; object-position:center; } @media(max-width:760px){ .razavi-banner-static{ border-radius:16px; margin-bottom:12px; } .razavi-banner-static img{ width:100%; height:auto; aspect-ratio:1380/336; object-fit:contain; object-position:center; } } /* ShareHome v44: dashboard typography and secure maintenance */ .latest-periods-panel .panel-head h2{font-size:1.38rem!important} .modern-period-cards .period-card h3{font-size:1.72rem!important} .latest-periods-panel .panel-kicker,.latest-periods-panel .panel-head p,.latest-periods-panel .panel-head>a,.modern-period-cards .period-type,.modern-period-cards .period-card p,.modern-period-cards .suite-badge,.modern-period-cards .status-chip{font-size:calc(1em + 1px)!important} .maintenance-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:20px}.maintenance-card{padding:22px}.maintenance-card h2{font-size:1.45rem!important;margin:8px 0}.maintenance-card p{color:var(--ds-muted);line-height:1.9}.stack-form{display:grid;gap:12px;margin-top:16px}.danger-zone{border-color:#fecaca;background:#fffafa}.danger-zone .eyebrow,.danger-zone h2{color:var(--ds-danger)}.year-history{margin-top:20px;padding:22px} @media(max-width:900px){.maintenance-grid{grid-template-columns:1fr}.modern-period-cards .period-card h3{font-size:1.55rem!important}} /* ========================================================= ShareHome Central Typography System - v45 تنها مرجع اندازه عنوان‌ها و ریزمتن‌های کل سامانه ========================================================= */ :root{ --ds-title-scale:1; --ds-body-scale:1; --ds-meta-scale:1; --ds-font-body:calc(15px * var(--ds-body-scale)); --ds-font-title-xl:calc(23px * var(--ds-title-scale)); --ds-font-title-lg:calc(19px * var(--ds-title-scale)); --ds-font-title-md:calc(15px * var(--ds-title-scale)); --ds-font-title-sm:calc(13px * var(--ds-title-scale)); --ds-font-meta:calc(12px * var(--ds-meta-scale)); --ds-font-caption:calc(11.5px * var(--ds-meta-scale)); --ds-font-label:calc(12.5px * var(--ds-body-scale)); --ds-line-body:1.85; --ds-line-meta:1.75; } html{font-size:var(--ds-font-body)!important} body{font-size:var(--ds-font-body)!important;line-height:var(--ds-line-body)!important} /* عنوان‌های اصلی، بخش‌ها و کارت‌ها؛ یک پله کوچک‌تر و یکپارچه */ h1, .hero-panel h1, .page-heading h1, .ds-page-header h1, .users-heading h1, .showcase-content h1, .auth-card h2{ font-size:var(--ds-font-title-xl)!important; line-height:1.55!important; } h2, .panel-head h2, .section-title b, .user-tools h2, .user-modal-card>header h2{ font-size:var(--ds-font-title-md)!important; line-height:1.6!important; } h3, .period-card h3, .owner-card-head h3, .user-identity h3, .account-main h3, .info-section h3{ font-size:var(--ds-font-title-sm)!important; line-height:1.65!important; } h4,h5,h6{font-size:var(--ds-font-title-sm)!important;line-height:1.65!important} .topbar-title b,.brand strong,.user-panel b{font-size:var(--ds-font-title-md)!important} /* ریزمتن‌های عمومی؛ یک پله بزرگ‌تر در تمام صفحات */ small, .eyebrow, .panel-kicker, .nav-caption, .topbar-title small, .brand span, .user-panel small, .stat-card span, .stat-card small, .panel-head p, .panel-head>a, .owner-name small, .progress-meta, .donut span, .legend p, .period-type, .period-card p, .status-chip, .ds-badge, .form-hint, .form-divider, .field-help, .users-heading p, .user-stat span, .user-stat small, .user-role-row span, .user-meta-grid span, .user-modal-card>header p, .role-card small, .permission-group>label, .permission-toolbar span, .group-toggle, .info-grid span, .account-main p, .account-metrics span, .rate-summary, .empty-state{ font-size:var(--ds-font-meta)!important; line-height:var(--ds-line-meta)!important; } /* نوشته‌های فرم و کنترل‌ها */ label,.form-grid label,.auth-form label{font-size:var(--ds-font-label)!important;line-height:1.7!important} input,select,textarea,.button,button{font-size:var(--ds-font-label)!important} th{font-size:var(--ds-font-label)!important} td{font-size:var(--ds-font-body)!important} .field-error{font-size:var(--ds-font-caption)!important} /* متن‌های عادی داخل پنل‌ها و توضیحات */ p,.manager-note,.owner-progress,.user-role-row b,.user-meta-grid b,.info-grid b{ line-height:var(--ds-line-body); } /* موبایل هم دقیقاً از همان مقادیر مرکزی پیروی می‌کند */ @media(max-width:760px){ :root{ --ds-font-body:calc(15px * var(--ds-body-scale)); --ds-font-title-xl:calc(21px * var(--ds-title-scale)); --ds-font-title-lg:calc(18px * var(--ds-title-scale)); --ds-font-title-md:calc(15px * var(--ds-title-scale)); --ds-font-title-sm:calc(13px * var(--ds-title-scale)); --ds-font-meta:calc(12px * var(--ds-meta-scale)); --ds-font-caption:calc(11.5px * var(--ds-meta-scale)); --ds-font-label:calc(12.5px * var(--ds-body-scale)); } } /* ShareHome v46: controls for central design settings */ .design-settings-card{margin-top:20px;padding:24px} .design-settings-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:20px} .design-settings-head h2{margin:6px 0 4px} .design-settings-head p{margin:0;color:var(--ds-muted)} .design-settings-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px} .design-setting-box{padding:17px;border:1px solid var(--ds-border);border-radius:var(--ds-radius-md);background:var(--ds-surface-alt)} .design-setting-box label{display:grid;gap:9px} .design-setting-box small{display:block;margin-top:8px;color:var(--ds-muted)} .design-preview{margin-top:18px;padding:18px;border:1px dashed #b8c7d8;border-radius:var(--ds-radius-md);background:#fff} .design-preview h3{margin:0 0 6px}.design-preview p{margin:0 0 5px}.design-preview small{color:var(--ds-muted)} .settings-submit-row{grid-column:1/-1;display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:18px} @media(max-width:900px){.design-settings-grid{grid-template-columns:1fr}.design-settings-head{flex-direction:column}.settings-submit-row{grid-column:auto}} /* ShareHome v47: modern settings center */ .settings-page{max-width:1240px;margin:0 auto;display:grid;gap:20px;padding-bottom:40px} .settings-hero{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:28px 30px;border:1px solid var(--ds-border);border-radius:26px;background:linear-gradient(135deg,#ffffff 0%,#f2fbf9 100%);box-shadow:0 16px 45px rgba(15,118,110,.08)} .settings-hero::after{content:"";position:absolute;left:-80px;top:-110px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(45,212,191,.16),transparent 68%)} .settings-hero-copy{position:relative;z-index:1}.settings-hero h1{margin:7px 0 8px;font-size:clamp(1.65rem,2.2vw,2.25rem)}.settings-hero p{margin:0;color:var(--ds-muted);line-height:1.9} .settings-hero-badge{position:relative;z-index:1;width:72px;height:72px;display:grid;place-items:center;border-radius:22px;background:linear-gradient(135deg,#0f766e,#14b8a6);color:#fff;font-size:32px;box-shadow:0 14px 30px rgba(15,118,110,.24)} .settings-jump-nav{position:sticky;top:84px;z-index:10;display:flex;gap:9px;flex-wrap:wrap;padding:10px;border:1px solid var(--ds-border);border-radius:18px;background:rgba(255,255,255,.9);backdrop-filter:blur(14px);box-shadow:0 10px 28px rgba(15,23,42,.06)} .settings-jump-nav a{display:flex;align-items:center;gap:8px;padding:10px 14px;border-radius:12px;text-decoration:none;color:#475569;font-weight:700;transition:.18s}.settings-jump-nav a:hover{background:#ecfdf5;color:#0f766e}.settings-jump-nav .danger-link:hover{background:#fff1f2;color:#b42318}.settings-jump-nav span{width:23px;height:23px;display:grid;place-items:center;border-radius:8px;background:#f1f5f9} .settings-main-form{display:grid;gap:20px}.settings-section-card{scroll-margin-top:150px;padding:26px;border:1px solid var(--ds-border);border-radius:24px;background:#fff;box-shadow:0 12px 34px rgba(15,23,42,.055)} .settings-section-head{display:flex;align-items:flex-start;gap:14px;padding-bottom:20px;margin-bottom:22px;border-bottom:1px solid #edf1f5}.settings-section-head h2{margin:5px 0 5px;font-size:1.45rem}.settings-section-head p{margin:0;color:var(--ds-muted);line-height:1.8}.settings-section-icon{width:48px;height:48px;flex:0 0 auto;display:grid;place-items:center;border-radius:15px;background:#e8f7f4;color:#0f766e;font-size:22px;font-weight:900}.settings-section-icon.accent{background:#eef2ff;color:#4f46e5}.settings-section-icon.maintenance{background:#eff6ff;color:#2563eb}.settings-section-icon.danger-icon{background:#fff1f2;color:#b42318}.settings-section-icon.history-icon{background:#f5f3ff;color:#7c3aed} .settings-fields-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.settings-fields-grid.two-col{grid-template-columns:repeat(2,minmax(0,1fr))}.settings-field{display:grid;gap:7px;padding:14px;border:1px solid #e4eaf1;border-radius:16px;background:#fbfdff;transition:.18s}.settings-field:focus-within{border-color:#7dd3c7;background:#fff;box-shadow:0 0 0 4px rgba(20,184,166,.08)}.settings-field>span{font-weight:800;color:#243244}.settings-field>small{color:var(--ds-muted);line-height:1.65}.settings-field input,.settings-field select{height:44px;border:1px solid #dbe3ed;border-radius:11px;background:#fff;padding:0 12px;outline:none}.settings-field.compact{padding:0;border:0;background:transparent}.settings-field.compact:focus-within{box-shadow:none}.settings-subsection{margin-top:22px;padding-top:22px;border-top:1px dashed #dce4ec}.settings-subsection-title h3{margin:0 0 5px}.settings-subsection-title p{margin:0 0 14px;color:var(--ds-muted)}.suite-field>span{display:flex;align-items:center;gap:8px}.suite-dot{width:10px;height:10px;border-radius:50%}.suite-one{background:#3b82f6}.suite-two{background:#ec4899} .design-settings-grid.modern{gap:14px}.modern-box{position:relative;background:linear-gradient(180deg,#fff,#f8fafc);border-radius:18px;padding:16px}.modern-box select{height:46px;width:100%;border:1px solid #dce4ec;border-radius:12px;background:#fff;padding:0 12px;margin-top:12px}.setting-box-title{display:flex;align-items:center;gap:10px}.setting-symbol{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:#ecfdf5;color:#0f766e;font-size:18px;font-weight:900}.body-symbol{background:#eff6ff;color:#2563eb}.meta-symbol{background:#f5f3ff;color:#7c3aed}.modern-preview{position:relative;margin-top:18px;padding:22px 24px;background:linear-gradient(135deg,#fbfdff,#f6fffd);border-style:solid}.preview-label{position:absolute;left:16px;top:14px;padding:5px 9px;border-radius:999px;background:#e8f7f4;color:#0f766e;font-size:.75rem;font-weight:800}.modern-preview h3{padding-left:105px} .settings-sticky-actions{position:sticky;bottom:12px;z-index:12;display:flex;justify-content:flex-end;gap:10px;padding:12px;border:1px solid var(--ds-border);border-radius:17px;background:rgba(255,255,255,.92);backdrop-filter:blur(12px);box-shadow:0 12px 35px rgba(15,23,42,.12)} .modern-maintenance{grid-template-columns:repeat(2,minmax(0,1fr));margin:0}.action-card{display:flex;gap:16px;min-height:100%;padding:20px;border:1px solid #e4eaf1;border-radius:20px;background:linear-gradient(180deg,#fff,#fafcff);box-shadow:none}.action-card-icon{width:48px;height:48px;flex:0 0 auto;display:grid;place-items:center;border-radius:15px;background:#e8f7f4;color:#0f766e;font-size:24px;font-weight:900}.year-card .action-card-icon{background:#eff6ff;color:#2563eb}.action-card-content{display:flex;flex-direction:column;flex:1}.action-card h3{margin:6px 0 7px;font-size:1.25rem}.action-card p{margin:0;color:var(--ds-muted);line-height:1.85}.action-features{margin:14px 0 18px;padding:0;list-style:none;display:grid;gap:7px;color:#475569}.action-features li::before{content:"✓";color:#0f766e;font-weight:900;margin-left:7px}.action-card form{margin-top:auto}.full-button{width:100%;justify-content:center} .danger-section{border-color:#fecaca;background:linear-gradient(180deg,#fff,#fffafa)}.danger-section .settings-section-head{border-color:#fee2e2}.danger-section .eyebrow,.danger-section h2{color:#b42318}.danger-panel{display:grid;grid-template-columns:1.15fr .85fr;gap:22px;align-items:start}.danger-warning{padding:19px;border:1px solid #fecaca;border-radius:17px;background:#fff1f2}.danger-warning strong{display:block;color:#9f1239;margin-bottom:8px}.danger-warning p{margin:0;color:#7f1d1d;line-height:1.9}.danger-form{display:grid;gap:13px;padding:19px;border:1px solid #f3d3d3;border-radius:17px;background:#fff}.compact-head{margin-bottom:16px}.modern-table-wrap{border:1px solid #e5eaf0;border-radius:16px;overflow:hidden}.modern-table-wrap table{margin:0} @media(max-width:900px){.settings-hero{padding:22px}.settings-hero-badge{width:58px;height:58px}.settings-jump-nav{top:72px;overflow:auto;flex-wrap:nowrap}.settings-jump-nav a{white-space:nowrap}.settings-fields-grid,.settings-fields-grid.two-col,.modern-maintenance,.danger-panel{grid-template-columns:1fr}.settings-section-card{padding:20px}.settings-sticky-actions{bottom:8px}.modern-preview h3{padding-left:0;padding-top:34px}} @media(max-width:600px){.settings-page{gap:14px}.settings-hero{align-items:flex-start}.settings-hero-badge{display:none}.settings-section-head{gap:10px}.settings-section-icon{width:42px;height:42px}.settings-sticky-actions{display:grid;grid-template-columns:1fr 1fr}.settings-sticky-actions .button{width:100%;padding-inline:8px}.action-card{flex-direction:column}.settings-jump-nav{margin-inline:-4px}} /* v10 — allocation management/report helpers */ .inline-manage{display:inline-block;vertical-align:top}.inline-manage>summary{list-style:none;cursor:pointer}.inline-manage>summary::-webkit-details-marker{display:none}.inline-allocation-form{display:grid;gap:6px;min-width:260px;margin-top:7px;padding:10px;border:1px solid var(--ds-line,#e5e9e6);border-radius:10px;background:#fff;box-shadow:0 10px 28px rgba(30,40,35,.08)}.inline-allocation-form select,.inline-allocation-form input{min-height:36px}.mini-check{display:flex!important;align-items:center;gap:6px;font-size:9px!important}.mini-check input{width:15px!important;height:15px!important;min-height:0!important}.season-rights-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin-top:14px}.season-right{display:grid;gap:3px;padding:12px;border:1px solid #e5e9e6;border-radius:12px;background:#fff}.season-right span{font-size:9px;color:#79837e}.season-right b{font-size:11px}.season-right small{font-size:8.5px;color:#929a96}.season-right.unused{background:#f7fbf8;border-color:#dce9e1}.season-right.unused b{color:#426154}.season-right.used{background:#fafafa}.owner-rights-report .owner-profile-stats{margin-top:4px} @media(max-width:760px){.inline-allocation-form{min-width:220px}.season-rights-grid{grid-template-columns:1fr 1fr}} @media print{.sidebar,.top-header,.page-heading .heading-actions{display:none!important}.content{padding:0!important}.panel{box-shadow:none!important;break-inside:avoid}} /* Ownership lineage transfer: keep fairness/history with the share itself. */ .ownership-transfer-card{padding:14px 16px;border:1px solid var(--line,#dfe5ec);border-radius:14px;background:#f8fafc} .ownership-transfer-card label{display:grid;gap:7px;font-weight:700;color:var(--ink,#182230)} .ownership-transfer-card .field-help{margin:8px 0 0;line-height:1.9;color:var(--muted,#667085)} #shareInput[data-inherited="1"]{background:#f1f5f9;color:#334155;cursor:not-allowed} /* ===== ui-refresh-v3-1.css ===== */ /* ShareHome UI v3 — shared visual layer. Loaded after legacy styles. */ :root{ --bg:#f4f5f1;--surface:#fff;--surface-2:#f8faf7;--text:#20332f;--muted:#697b74; --line:#dfe8e1;--primary:#126b60;--primary-2:#0e5149;--danger:#b84742; --ds-primary:#126b60;--ds-primary-hover:#0e5149;--ds-primary-soft:#e8f4ef; --ds-bg:#f4f5f1;--ds-surface:#fff;--ds-surface-alt:#f8faf7;--ds-border:#dfe8e1; --ds-text:#20332f;--ds-muted:#697b74;--ds-danger:#b84742;--ds-danger-soft:#fff2ef; --ds-success:#177559;--ds-success-soft:#eaf6ef;--ds-warning:#986720;--ds-warning-soft:#fff7e8; --ds-radius-sm:12px;--ds-radius-md:18px;--ds-radius-lg:22px; --ds-shadow:0 12px 38px rgba(22,56,46,.055);--ds-content-max:1480px; --ds-control-h:48px; } html{scroll-padding-top:112px} body{color:var(--ds-text);background:radial-gradient(circle at 82% -30%,#e5eee6 0,transparent 32%),#f4f5f1;font-family:Tahoma,"Segoe UI",Arial,sans-serif} .icon-defs{position:absolute;width:0;height:0;overflow:hidden} .icon{width:20px;height:20px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round} .skip-link{position:fixed;right:15px;top:-80px;z-index:1000;background:#fff;color:#124b42;padding:9px 16px;border-radius:12px} .skip-link:focus{top:12px} :where(a,button,input,select,textarea):focus-visible{outline:3px solid #d3a65a;outline-offset:3px} [hidden]{display:none!important} /* Application shell */ .app-shell{background:transparent;min-height:100svh} .sidebar{width:270px;padding:20px 13px 16px;background:radial-gradient(circle at 85% 0%,rgba(215,169,91,.13),transparent 28%),linear-gradient(180deg,#163d37,#102f2c);border-left:1px solid rgba(255,255,255,.08);box-shadow:-10px 0 35px rgba(13,46,40,.11);color:#f5faf6} .brand{padding:2px 7px 19px;gap:12px;border-bottom:1px solid rgba(255,255,255,.12)} .brand-mark{width:46px;height:46px;border-radius:15px;background:#e5b96f;color:#173b35;box-shadow:inset 0 1px rgba(255,255,255,.5),0 10px 24px rgba(0,0,0,.12);letter-spacing:-.06em;font-size:18px} .brand-copy{min-width:0}.brand strong{font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.brand span{color:#adcbc0;font-size:.7rem;margin-top:2px} .sidebar-property{display:flex;align-items:center;gap:10px;margin:17px 4px 11px;padding:12px;border:1px solid rgba(216,235,224,.15);border-radius:15px;background:rgba(255,255,255,.075);min-width:0} .property-glow{width:8px;height:8px;flex:0 0 8px;background:#ecc786;border-radius:50%;box-shadow:0 0 0 4px rgba(236,199,134,.13)} .sidebar-property div{min-width:0;display:grid;gap:2px}.sidebar-property small{color:#b3cfc3;font-size:.7rem}.sidebar-property b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.82rem} .property-year{margin-right:auto;font-variant-numeric:tabular-nums;color:#f3dbb2;font-size:.8rem} .sidebar-nav{flex:1;gap:2px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.22) transparent;padding:0 2px 8px} .nav-caption{color:#9cbbb0;font-weight:800;letter-spacing:0;padding:17px 13px 6px} .sidebar-nav a{display:flex;align-items:center;gap:12px;min-height:42px;padding:9px 12px;margin:0 0 2px;border-radius:11px;color:#d8e8df;transition:background .18s,color .18s,transform .18s} /* Legacy CSS sized the icon's span to 22px. The redesigned links use SVG icons and a text span, so give the text its own flexible, single-line column. */ .sidebar-nav a > span:not(.nav-count){width:auto;min-width:0;flex:1;text-align:right;font-size:inherit;line-height:1.5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .sidebar-nav a > .nav-count{width:auto;flex:0 0 auto;text-align:center;font-size:.75rem} .sidebar-nav a .icon{width:19px;height:19px;color:#a6c7b7} .sidebar-nav a:hover{background:rgba(255,255,255,.09);color:white;transform:translateX(-2px)} .sidebar-nav a.active{background:#eaf4ed;color:#173e36;box-shadow:0 5px 15px rgba(0,0,0,.1);font-weight:900} .sidebar-nav a.active .icon{color:#126b60} .nav-count{margin-right:auto;min-width:22px;height:22px;padding:0 5px;display:grid;place-items:center;border-radius:7px;background:#e7b96c;color:#193a32;font-size:.75rem} .sidebar-install{margin:10px 6px 0;background:rgba(255,255,255,.08)!important;color:#f7ead2!important;border:1px solid rgba(234,205,156,.25)!important;text-align:center} .sidebar-footer{padding:11px 4px 0;border-top:1px solid rgba(255,255,255,.12)} .sidebar-account{display:flex;align-items:center;gap:10px;padding:8px 7px;text-decoration:none;border-radius:12px} .sidebar-account:hover{background:rgba(255,255,255,.07)} .sidebar-account .avatar{background:#d9ece2;color:#185348}.account-copy{flex:1;min-width:0}.account-copy b,.account-copy small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.account-copy b{font-size:.8rem}.account-copy small{color:#aac9bc;font-size:.68rem}.sidebar-account>.icon{width:16px;color:#a9c5b8} .logout-link{margin:4px 0 0;padding:9px 12px;gap:10px;color:#f0c6bc;background:transparent;border-radius:11px}.logout-link:hover{background:rgba(255,255,255,.07)}.logout-link .icon{width:18px;height:18px} .logout-link > span{width:auto;min-width:0;flex:1;text-align:right;font-size:inherit;white-space:nowrap} .workspace{margin-right:270px;min-width:0} .topbar{height:82px;padding:0 clamp(20px,3vw,48px);background:rgba(255,255,255,.82);border-bottom:1px solid #e6ece5;box-shadow:0 6px 22px rgba(24,55,45,.035);backdrop-filter:blur(16px)} .topbar-title small{color:#7b8d83;margin:0 0 1px}.topbar-title b{color:#1c3a33;font-weight:900} .topbar-actions{gap:10px}.topbar-year{background:#edf4ee;border:1px solid #dce9df;color:#2e6756;border-radius:9px;padding:5px 12px;font-size:.82rem;font-weight:800} .notification-bell{display:grid;place-items:center;width:40px;height:40px;border:1px solid #e1e9e2;border-radius:11px;background:#fff;font-size:initial} .notification-bell .icon{width:21px;height:21px}.notification-bell:hover{border-color:#a9cbc0;background:#f5faf7}.notification-count{top:-7px;right:-7px} .small-avatar{width:40px;height:40px;border-radius:12px;background:#dbede5;border:1px solid #c7dfd2;color:#1b6a59} .page-content{max-width:var(--ds-content-max);padding:clamp(20px,2.5vw,36px) clamp(18px,3vw,42px) 52px;animation:sharehome-enter .3s ease both} @keyframes sharehome-enter{from{opacity:.65;transform:translateY(8px)}to{opacity:1;transform:none}} .mobile-dock{display:none} /* Shared surfaces, hierarchy and controls */ .page-heading,.ds-page-header,.users-heading{margin:0 0 22px;align-items:end} .page-heading h1,.ds-page-header h1,.users-heading h1{color:#193e36;margin:2px 0 4px;font-weight:900} .page-heading p,.ds-page-header p,.users-heading p{color:#6e8076;margin:0} .eyebrow,.panel-kicker{color:#97703a;letter-spacing:0;font-weight:900} .panel,.card,.ds-card,.settings-section-card{background:#fff;border:1px solid #e1e9e2;border-radius:22px;box-shadow:var(--ds-shadow)} .panel{padding:clamp(19px,2.4vw,28px)}.card{padding:22px;margin-bottom:20px}.card.narrow{max-width:720px} .panel-head{padding-bottom:16px;border-bottom:1px solid #ecf0ea;margin-bottom:18px;align-items:end} .panel-head h2{color:#20483d;margin:0}.panel-head p{color:#77877e}.panel-head>a{color:#126b60;text-decoration:none;font-weight:800}.panel-head>a:hover{text-decoration:underline} .button,button{font-weight:800;min-height:42px;border-radius:11px} .button.primary,button.primary,button.button:not(.secondary):not(.ghost-danger):not(.danger):not(.icon-button):not(.modal-close):not(.sidebar-install):not(.text-button):not(.group-toggle):not(.sidebar-close):not(.menu-button):not(.button-secondary):not(.button-danger){background:#126b60;color:#fff} .button.primary:hover,button.primary:hover{background:#0d5149;box-shadow:0 7px 16px rgba(18,107,96,.17)} .button.secondary,button.secondary,.button.soft{background:#f0f5ef;color:#28584a;border:1px solid #dce8de} .button.secondary:hover,button.secondary:hover,.button.soft:hover{background:#e5f0e7;border-color:#afcfba} .button.danger,button.danger,.button.ghost-danger,button.ghost-danger,.button-danger{background:#fff2ef;color:#aa433e;border:1px solid #f1d2ca} .button.danger:hover,button.danger:hover{background:#ffe9e3} button:disabled,.button:disabled{opacity:.5;cursor:not-allowed;box-shadow:none} input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea{border:1px solid #d9e4da;border-radius:11px;background:#fbfcfa;color:#213d33;min-height:47px} input:not([type=checkbox]):not([type=radio]):focus,select:focus,textarea:focus{border-color:#3f9483;background:white;box-shadow:0 0 0 4px rgba(51,138,119,.11)} input::placeholder,textarea::placeholder{color:#99a99f} label{color:#345248;font-weight:800} .status-chip,.ds-badge{border-radius:8px;padding:5px 10px} .status-chip.active,.status-chip.free,.status-chip.active-status{background:#e8f5ed;color:#17684e} .status-chip.allocated{background:#e7f0fa;color:#2c628c}.status-chip.cancelled,.status-chip.inactive-status{background:#fff0ec;color:#ab4d3e} .flash{border-radius:13px;box-shadow:none}.flash.success{border-color:#c5e7d2}.flash.danger{border-color:#f2cec8} .empty-state{background:#fafbf8;border-color:#d7e1d8;color:#74847a} .table-wrap{border:1px solid #e5ebe5;border-radius:15px;background:#fff} .table-wrap table,.notice-scroll table{width:100%;border-collapse:collapse} th{background:#f4f7f2;color:#53695d;font-weight:900;white-space:nowrap} th,td{border-bottom:1px solid #edf1ed;padding:13px 15px}tbody tr:last-child td{border-bottom:0}tbody tr:hover td{background:#fafcf9} .actions{align-items:center}.actions form{max-width:100%}.actions select{min-width:150px} .form-grid,.grid,.grid-form{gap:16px}.grid,.grid-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))} .form-grid>label,.grid>label,.grid-form>label{display:grid;gap:7px} .stat-grid{gap:14px;margin:16px 0 22px}.stat-card,.user-stat{border:1px solid #e2eae3;background:#fff;border-radius:20px;box-shadow:0 9px 25px rgba(22,56,46,.045)} .stat-card{padding:20px;min-height:122px;align-items:center}.stat-card strong{color:#183d35}.stat-card span,.stat-card small{color:#718379}.stat-icon{background:#eaf3ed;color:#236e56;border-radius:13px} .stat-icon.blue{background:#eaf1f5;color:#3b7296}.stat-icon.amber{background:#fff4df;color:#9d7130}.stat-icon.violet{background:#f2edf5;color:#7a5a85} .owner-card,.user-card,.period-card,.account-card,.request-card,.notice-card{border:1px solid #e1e9e2;background:#fff;border-radius:18px;box-shadow:0 9px 26px rgba(22,56,46,.045)} .owner-card:hover,.user-card:hover,.period-card:hover,.account-card:hover{border-color:#a8d0bb;box-shadow:0 14px 32px rgba(22,56,46,.085)} .avatar{background:#e7f2e9;color:#165c4e;border-radius:12px}.status-chip{white-space:nowrap} .owner-metrics>div,.user-meta-grid>div,.account-metrics span,.info-grid>div{background:#f7f9f5;border:1px solid #eef1e9;border-radius:11px} .owner-card-head,.user-card-top{gap:12px}.owner-card-head h3,.user-identity h3{color:#24483b} .user-stat strong{color:#1c5c4e}.user-card-actions .button{min-height:40px} .period-card.special{border-color:#ead9b7;background:linear-gradient(145deg,#fff,#fffcf5)} .period-card .period-type{color:#8e693c;background:#fff2dc;border-radius:8px;padding:5px 9px} .panel .period-cards{margin-top:4px} .owner-modal-card,.user-modal-card{border-radius:22px;border:1px solid #e3eae2} .owner-modal-card>header,.user-modal-card>header{background:#f9fbf7} .owner-tab.active,.owner-tab[aria-selected=true]{color:#146756} .notification-bell,.mobile-dock a,.mobile-dock button{position:relative} .notice-card.unread{border-inline-start:4px solid #d9a65a}.notice-card h3{color:#1d483d} .notice-form input[type=checkbox]{accent-color:#126b60} .settings-hero{background:linear-gradient(125deg,#173f38,#205a4e);border:0;color:#fff;box-shadow:0 18px 34px rgba(22,64,51,.13)} .settings-hero h1,.settings-hero p,.settings-hero .eyebrow{color:#fff}.settings-hero p{color:#d6e7dc} .settings-hero-badge{background:rgba(255,255,255,.13);color:#f1cb8a;box-shadow:none;border:1px solid rgba(255,255,255,.2)} .settings-jump-nav{top:94px;border-color:#e1e9e2;box-shadow:0 7px 24px rgba(22,56,46,.07)} .settings-section-card{box-shadow:var(--ds-shadow)}.settings-section-icon{background:#e8f4ec;color:#1b6f56}.settings-field{background:#f9fbf8;border-color:#e6eee5} .settings-sticky-actions{border-color:#dfebe2}.rate-summary{background:#f0f7ef;border-color:#d5e8d8}.rate-summary span{color:#236e56} /* Dashboard and authentication */ .dashboard-commandbar{position:relative;overflow:hidden;background:linear-gradient(118deg,#173e38 0%,#235e50 72%,#316e58 100%);color:#fff;border:0;box-shadow:0 20px 40px rgba(28,80,61,.15);padding:27px 30px;border-radius:23px} .dashboard-commandbar::after{content:"";position:absolute;left:-44px;bottom:-102px;width:245px;height:245px;border:1px solid rgba(244,217,168,.23);border-radius:50%;box-shadow:0 0 0 44px rgba(255,255,255,.035)} .dashboard-commandbar>div{position:relative;z-index:1}.dashboard-commandbar .eyebrow{color:#efcf97}.dashboard-commandbar h2{color:#fff;margin:5px 0!important}.dashboard-commandbar p{color:#d8e8db!important} .dashboard-commandbar .button.primary{background:#e6bb75;color:#25463a;border:0}.dashboard-commandbar .button.primary:hover{background:#f2ce91} .dashboard-commandbar .button.secondary{background:rgba(255,255,255,.14);color:#fff;border:1px solid rgba(255,255,255,.24)} .dashboard-commandbar .button.soft{background:transparent;color:#eff8ee;border:1px solid rgba(255,255,255,.35)} .modern-stats .stat-card{border-radius:20px;box-shadow:0 9px 25px rgba(22,56,46,.045)} .modern-dashboard-grid{grid-template-columns:minmax(0,1.65fr) minmax(280px,.85fr)} .dashboard-main-panel,.dashboard-side-panel,.latest-periods-panel{background:#fff} .dashboard-main-panel .owner-progress:not(:last-child){border-bottom:1px solid #edf0ea} .owner-progress .progress{background:#eaf0e9}.owner-progress .progress i{background:linear-gradient(90deg,#caa05e,#147565)} .donut{filter:drop-shadow(0 7px 13px rgba(24,77,58,.1))}.donut:before{background:conic-gradient(#177863 calc(var(--value)*1%),#e8efe8 0)} .razavi-banner-static{border-radius:19px;box-shadow:0 13px 27px rgba(11,47,44,.12);margin:3px 0 22px;overflow:hidden} .razavi-banner-static img{display:block;width:100%;height:auto;object-fit:contain} .auth-page{background:linear-gradient(130deg,#edf3ec,#f9faf7 65%)} .auth-showcase{background:radial-gradient(circle at 80% 10%,rgba(232,193,125,.18),transparent 32%),linear-gradient(145deg,#113c36,#246251);color:#fff} .auth-showcase:before,.auth-showcase:after{border-color:rgba(239,219,179,.16)} .showcase-content .brand-mark.jumbo{background:#e6bb75;color:#183f35;box-shadow:0 17px 34px rgba(0,0,0,.1)} .showcase-content .eyebrow{color:#eaca8c}.showcase-content h1{color:#fff}.showcase-content p{color:#dbeadf}.feature-pills span{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.16)} .auth-card{border:1px solid #e3ebe3;background:#fff;border-radius:22px;box-shadow:0 28px 70px rgba(20,72,53,.12)} .auth-card .eyebrow{background:#f0f5eb;color:#547c50}.auth-card h2{color:#1d493d} .login-type-switch{background:#f1f5ee}.login-type-switch input:checked+span{border-color:#bad8c5;color:#165d4f;box-shadow:0 4px 13px rgba(32,91,69,.1)} .input-icon input{background:#f9fbf8;border-color:#dce6dc}.auth-form .button.primary{box-shadow:0 11px 22px rgba(18,107,96,.17)} .login-copyright{color:#819087} @media(max-width:1100px){.modern-dashboard-grid{grid-template-columns:1fr}.dashboard-side-panel{margin-top:0}} @media(max-width:900px){ .sidebar{width:min(320px,88vw);transform:translateX(110%);transition:transform .25s ease;z-index:60} .sidebar-open .sidebar{transform:translateX(0)} .sidebar-backdrop{position:fixed;inset:0;background:rgba(15,37,31,.55);z-index:55;opacity:0;visibility:hidden;transition:.25s} .sidebar-open .sidebar-backdrop{opacity:1;visibility:visible} .workspace{margin-right:0}.topbar{height:70px;padding:0 18px}.menu-button,.sidebar-close{display:grid;place-items:center} .sidebar-close{margin-right:auto;color:#fff}.menu-button .icon,.sidebar-close .icon{width:23px;height:23px} .page-content{padding:20px 17px 110px}.mobile-dock{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;bottom:0;right:0;left:0;z-index:45;padding:7px 7px calc(7px + env(safe-area-inset-bottom));background:rgba(255,255,255,.97);border-top:1px solid #dfe8e0;box-shadow:0 -10px 30px rgba(24,64,45,.08);backdrop-filter:blur(14px)} .mobile-dock a,.mobile-dock button{display:grid;justify-items:center;align-content:center;gap:3px;min-height:54px;padding:4px;border:0;border-radius:11px;background:transparent!important;color:#657b6d!important;text-decoration:none;font-size:.75rem!important;line-height:1.1} .mobile-dock .icon{width:21px;height:21px}.mobile-dock a.active{background:#e9f3eb!important;color:#176457!important;font-weight:900}.mobile-dock a.active .icon{stroke-width:2.2}.mobile-dock span{white-space:nowrap} .dock-count{position:absolute;top:0;right:calc(50% - 19px);width:16px;height:16px;display:grid;place-items:center;border-radius:50%;background:#b74942;color:#fff;font-size:10px} .topbar-year{display:none}.sidebar-nav{padding-bottom:10px} .settings-jump-nav{top:78px} } @media(max-width:760px){ .page-heading,.ds-page-header,.users-heading{align-items:stretch}.page-heading>.button,.ds-page-header>.button{width:100%} .panel,.card{padding:17px;border-radius:18px}.stat-grid{gap:10px}.stat-card{padding:14px;min-height:108px}.stat-icon{width:40px;height:40px} .table-wrap.mobile-cards{background:transparent;border:0;overflow:visible}.table-wrap.mobile-cards tr{border:1px solid #e0e9e0;border-radius:15px;box-shadow:0 7px 17px rgba(22,56,46,.045);padding:9px 14px} .table-wrap.mobile-cards td{align-items:flex-start;text-align:left;border:0;gap:12px}.table-wrap.mobile-cards td::before{flex:0 0 34%;color:#718178;font-weight:800}.table-wrap.mobile-cards td[colspan]::before{display:none} .table-wrap.mobile-cards td.actions{border-top:1px solid #edf0ea;display:flex;flex-wrap:wrap}.table-wrap.mobile-cards td.actions form{flex:1} .grid,.grid-form,.form-grid{grid-template-columns:1fr}.wide{grid-column:auto}.account-grid,.account-metrics{grid-template-columns:1fr} .dashboard-commandbar{padding:22px}.dashboard-quick-actions{display:grid;grid-template-columns:1fr;width:100%}.dashboard-quick-actions .button{width:100%} .razavi-banner-static{border-radius:12px}.settings-section-card{padding:18px}.owner-card,.user-card{border-radius:16px} } @media(max-width:520px){.topbar-title b{font-size:1rem!important}.topbar-title small{font-size:.68rem!important}.topbar-actions{gap:7px}.small-avatar,.notification-bell{width:36px;height:36px}.stat-grid,.stat-grid.three{grid-template-columns:repeat(2,minmax(0,1fr))}.stat-card{display:block}.stat-card .stat-icon{margin-bottom:8px}.stat-card strong{font-size:1.25rem!important}.notice-card{padding:17px}} @media(max-width:350px){.mobile-dock a,.mobile-dock button{font-size:.66rem!important}.mobile-dock .icon{width:18px;height:18px}} @media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}} /* Page specific layouts */ .section-gap{margin-top:20px}.status-chip.special{background:#fff2dc;color:#87642d} .transfer-form{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.transfer-form input{min-width:130px;width:150px}.transfer-form select{min-width:150px;width:auto}.transfer-form button{white-space:nowrap} .lottery-layout{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(270px,.75fr);gap:18px;align-items:start}.lottery-form,.profile-form{display:grid;gap:16px}.lottery-form label,.profile-form label{display:grid;gap:8px}.lottery-form button,.profile-form button{justify-self:start}.lottery-guide{background:#f9fbf8}.lottery-guide h2{margin:5px 0 8px;color:#1e4c3d}.lottery-guide p{color:#647a6d;line-height:1.95}.lottery-cycle{display:flex;justify-content:space-between;align-items:center;margin:20px 0 14px;padding:14px;background:#edf5eb;border-radius:12px}.lottery-cycle b{font-size:1.3rem;color:#1b7155}.lottery-result{display:grid;gap:4px;margin-top:18px;padding:15px;border:1px solid #b9ddc2;background:#eff9ef;border-radius:12px}.lottery-result span{color:#5f7966}.lottery-result strong{color:#175b47;font-size:1.35rem} .profile-layout{display:grid;grid-template-columns:minmax(240px,.65fr) minmax(0,1.35fr);gap:18px;align-items:start}.profile-summary{display:grid;justify-items:start;gap:12px}.profile-summary .avatar{width:62px;height:62px;font-size:1.5rem}.profile-summary h2{margin:0;color:#1e4c3d}.profile-summary p{margin:3px 0 7px;color:#758579;direction:ltr;text-align:right}.profile-form{max-width:530px} .bank-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.bank-card{border:1px solid #e1e9e2;border-radius:17px;padding:19px;background:#fff;display:grid;gap:15px;box-shadow:0 7px 20px rgba(22,56,46,.035)}.bank-card-head{display:flex;align-items:center;gap:11px}.bank-card-head>div:nth-child(2){min-width:0;flex:1}.bank-card h3{margin:0;color:#204f40}.bank-card p{margin:3px 0 0;color:#6e8075}.bank-emblem{width:45px;height:45px;display:grid;place-items:center;border-radius:13px;background:#e7f2e8;color:#236b56}.bank-card dl{display:grid;gap:8px;margin:0}.bank-card dl>div{display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px solid #eef1eb}.bank-card dt{color:#728477}.bank-card dd{margin:0;overflow-wrap:anywhere;font-weight:700;direction:ltr;text-align:left}.bank-card .bank-note{margin:0;white-space:pre-wrap}.bank-card form{margin-top:auto}.bank-card button{width:100%} @media(max-width:900px){.lottery-layout,.profile-layout{grid-template-columns:1fr}.bank-grid{grid-template-columns:1fr}} @media(max-width:760px){.transfer-form{width:100%}.transfer-form select,.transfer-form input,.transfer-form button{width:100%}.bank-card{padding:16px}} .page-content > .panel + .panel,.page-content > .card + .card{margin-top:20px} .table-wrap td.actions{display:table-cell;white-space:normal} .table-wrap td.actions form{display:inline-flex;vertical-align:middle;margin:2px 3px;max-width:100%} @media(max-width:760px){.table-wrap.mobile-cards td.actions{display:flex}.table-wrap.mobile-cards td.actions form{display:flex;margin:2px 0}} /* Hammelk brand + unit overview refresh */ .brand.brand-inline{ min-height:54px; padding:4px 8px 17px; gap:10px; } .brand-copy.brand-copy-inline{ flex:1; min-width:0; display:flex; align-items:center; gap:8px; white-space:nowrap; overflow:hidden; } .brand-copy.brand-copy-inline strong{ flex:0 0 auto; font-size:1.08rem!important; color:#fff; line-height:1.2; } .brand-copy.brand-copy-inline span{ display:inline; margin:0; color:#a9c8bb; font-size:.72rem; line-height:1.2; overflow:hidden; text-overflow:ellipsis; } .brand-copy.brand-copy-inline .brand-separator{ flex:0 0 auto; color:#e5bb74; font-size:.92rem; overflow:visible; } .sidebar-property.suite-overview{ display:block; margin:16px 4px 13px; padding:12px; background:linear-gradient(145deg,rgba(255,255,255,.095),rgba(255,255,255,.055)); border:1px solid rgba(220,238,228,.17); border-radius:17px; box-shadow:inset 0 1px rgba(255,255,255,.035); } .suite-overview-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px; } .suite-overview-head small{ color:#b8d2c6; font-size:.7rem; font-weight:800; } .suite-overview .property-year{ margin:0; padding:3px 7px; border-radius:7px; background:rgba(229,185,111,.11); color:#f1d29d; font-size:.66rem; font-weight:900; } .suite-overview-list{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; } .suite-overview-item{ min-width:0; display:flex; align-items:center; gap:7px; padding:8px 9px; border-radius:10px; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.07); } .suite-overview-item b{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#f2f8f4; font-size:.73rem; font-weight:900; } .suite-overview-empty{ grid-column:1/-1; color:#a9c8bb; font-size:.72rem; padding:5px 2px; } .suite-color-dot{ width:9px; height:9px; flex:0 0 9px; display:inline-block; border-radius:50%; background:#8db7a8; box-shadow:0 0 0 3px rgba(141,183,168,.12); } .suite-color-dot.pink{background:#e7a6b8;box-shadow:0 0 0 3px rgba(231,166,184,.13)} .suite-color-dot.blue{background:#83b9df;box-shadow:0 0 0 3px rgba(131,185,223,.13)} .suite-color-dot.green{background:#82bea3;box-shadow:0 0 0 3px rgba(130,190,163,.13)} .topbar.topbar-premium{ min-height:88px; height:88px; margin:12px 18px 0; padding:0 24px; top:10px; border:1px solid #dce8df; border-radius:22px; background:linear-gradient(112deg,rgba(255,255,255,.97) 0%,rgba(247,250,245,.97) 58%,rgba(249,242,229,.96) 100%); box-shadow:0 12px 34px rgba(31,73,58,.08); overflow:hidden; isolation:isolate; } .topbar.topbar-premium::before{ content:""; position:absolute; z-index:-1; left:-72px; top:-108px; width:245px; height:245px; border-radius:50%; border:1px solid rgba(203,161,91,.19); box-shadow:0 0 0 35px rgba(211,174,109,.045),0 0 0 68px rgba(44,112,90,.025); } .topbar.topbar-premium::after{ content:""; position:absolute; z-index:-1; right:0; top:0; bottom:0; width:5px; background:linear-gradient(180deg,#1a705f,#d4a75f); } .topbar-premium>*{position:relative;z-index:1} .topbar-premium .topbar-title{display:grid;gap:4px;min-width:0} .topbar-premium .topbar-meta{ display:flex; align-items:center; gap:7px; color:#74887d; font-size:.69rem; } .topbar-premium .topbar-meta small{margin:0;color:#74887d;font-size:.69rem} .topbar-premium .topbar-meta i{width:4px;height:4px;border-radius:50%;background:#d3a65e} .topbar-premium .topbar-brand-name{color:#9a7137;font-weight:900} .topbar-premium .topbar-title b{ color:#173f36; font-size:1.05rem!important; font-weight:950; line-height:1.35; } .topbar-suite-list{ display:flex; align-items:center; gap:7px; margin-right:22px; } .topbar-suite-chip{ display:inline-flex; align-items:center; gap:7px; min-height:32px; padding:5px 10px; border-radius:10px; border:1px solid #dde8de; background:rgba(255,255,255,.72); color:#355b4e; font-size:.72rem; font-weight:900; white-space:nowrap; } .topbar-premium .topbar-actions{margin-right:auto;gap:9px} .topbar-premium .notification-bell, .topbar-premium .small-avatar{ background:rgba(255,255,255,.82); border-color:#dbe6dd; box-shadow:0 5px 15px rgba(31,73,58,.045); } @media(max-width:1100px){ .topbar-suite-list{display:none} } @media(max-width:900px){ .brand.brand-inline{padding-top:2px} .topbar.topbar-premium{ height:70px; min-height:70px; margin:8px 10px 0; top:6px; padding:0 13px; border-radius:17px; } .topbar-premium .topbar-title{gap:1px} .topbar-premium .topbar-meta{font-size:.64rem} .topbar-premium .topbar-meta small{font-size:.64rem!important} .topbar-premium .topbar-title b{font-size:.94rem!important} .topbar-premium .topbar-actions{gap:6px} } @media(max-width:520px){ .brand-copy.brand-copy-inline{gap:6px} .brand-copy.brand-copy-inline strong{font-size:1rem!important} .brand-copy.brand-copy-inline span{font-size:.68rem} .suite-overview-list{grid-template-columns:1fr 1fr} .topbar-premium .topbar-brand-name{display:none} .topbar-premium .topbar-meta i{display:none} } /* ===== sidebar-menu-v3-6.css ===== */ /* Page-oriented navigation: main sidebar only contains top-level sections. */ .sidebar-nav.organized-menu{gap:8px;padding-inline:2px} .organized-menu .menu-section{ display:flex; align-items:center; gap:10px; flex:0 0 auto; width:100%; min-height:48px; margin:0; padding:10px 12px; border:1px solid rgba(224,239,228,.13); border-radius:14px; background:rgba(255,255,255,.035); color:#e4f0e8; text-decoration:none; font-size:15px; font-weight:800; line-height:1.5; transition:background .16s ease,border-color .16s ease,transform .16s ease; } .organized-menu .menu-section:hover{background:rgba(255,255,255,.08);transform:translateX(-1px)} .organized-menu .menu-section:focus-visible{outline:3px solid #e8c781;outline-offset:-3px} .organized-menu .menu-section>.icon{width:19px;height:19px;flex:0 0 auto;color:#b4d0c0} .organized-menu .menu-section>span:not(.menu-open-mark){min-width:0;flex:1} .organized-menu .menu-open-mark{flex:0 0 auto;font-size:24px;line-height:1;color:#91aa9d;transform:translateY(-1px)} .organized-menu .menu-section.active{ color:#f4d6a0; border-color:rgba(230,185,111,.55); background:rgba(255,255,255,.085); box-shadow:inset -3px 0 #d7aa66,0 4px 12px rgba(0,0,0,.08); } .organized-menu .menu-section.active>.icon,.organized-menu .menu-section.active>.menu-open-mark{color:#f0cc8f} .organized-menu .menu-home{margin-bottom:4px;background:rgba(255,255,255,.055)} .organized-menu .menu-home.active{color:#173f36;border-color:#c8e0ce;background:#eaf4ed;box-shadow:none} .organized-menu .menu-home.active>.icon{color:#176457} .organized-menu .nav-count{ display:grid; place-items:center; min-width:21px; height:21px; padding:0 5px; margin-right:auto; border-radius:7px; background:#e7b96c; color:#173b34; font-size:12px; } @media(max-width:900px){ .organized-menu .menu-section{min-height:50px} } @media(prefers-reduced-motion:reduce){.organized-menu .menu-section{transition:none}} /* ===== section-pages-v1.css ===== */ /* Section landing pages (same page-oriented menu pattern as the gallery system). */ .section-hub-hero{display:flex;align-items:center;gap:18px;padding:25px 27px;margin-bottom:20px;border:1px solid #dce8df;border-radius:24px;background:linear-gradient(120deg,#f7faf5,#fff);box-shadow:0 10px 27px rgba(22,56,46,.045)} .section-hub-icon{width:64px;height:64px;display:grid;place-items:center;flex:0 0 auto;border-radius:19px;background:#e8f2e8;color:#1d6b56} .section-hub-icon .icon{width:30px;height:30px} .section-hub-copy h1{margin:4px 0 7px;color:#173f36;font-size:clamp(1.45rem,2.5vw,2rem)} .section-hub-copy p{margin:0;color:#6d7e73;line-height:1.9} .section-hub-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px} .section-hub-card{display:flex;align-items:center;gap:14px;min-height:132px;padding:20px;border:1px solid #dfe8e0;border-radius:20px;background:#fff;color:#183e35;text-decoration:none;box-shadow:0 9px 24px rgba(22,56,46,.045);transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease} .section-hub-card:hover{transform:translateY(-2px);border-color:#b9d6c3;box-shadow:0 14px 30px rgba(22,56,46,.075)} .section-hub-card-icon{width:50px;height:50px;display:grid;place-items:center;flex:0 0 auto;border-radius:15px;background:#edf5eb;color:#236e56} .section-hub-card-icon .icon{width:24px;height:24px} .section-hub-card-copy{display:grid;gap:7px;min-width:0;flex:1} .section-hub-card-copy strong{font-size:1.05rem}.section-hub-card-copy small{color:#708177;line-height:1.8;font-size:.82rem} .section-hub-arrow{font-size:28px;color:#9bada2;line-height:1} /* Bank management */ .bank-page-heading{align-items:flex-end}.bank-heading-actions{display:flex;gap:9px;flex-wrap:wrap} .bank-overview{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;margin:18px 0 20px} .bank-overview article{display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px 12px;padding:17px 19px;border:1px solid #dfe8e0;border-radius:17px;background:#fff;box-shadow:0 7px 20px rgba(22,56,46,.035)} .bank-overview span{color:#61756a;font-weight:800}.bank-overview strong{grid-row:1/3;grid-column:2;font-size:1.65rem;color:#1b6653}.bank-overview small{color:#8a988f} .bank-list-panel{padding:22px}.bank-list-head{align-items:flex-start}.bank-security-note{display:inline-flex;align-items:center;min-height:34px;padding:7px 11px;border-radius:10px;background:#fff7e8;color:#87642d;font-size:.78rem;font-weight:800;border:1px solid #f1dfb8} .bank-grid-modern{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.bank-card-modern{gap:14px;padding:18px;border-radius:18px} .bank-card-modern.is-inactive{opacity:.72;background:#fafbfa}.bank-card-topline{display:flex;align-items:center;gap:11px}.bank-card-title{min-width:0;flex:1}.bank-title-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.bank-card-title h3{margin:0}.bank-default-badge{display:inline-flex;padding:4px 8px;border-radius:999px;background:#eef8ed;color:#24684f;font-size:.7rem;font-weight:900;border:1px solid #d3e9d6}.bank-card-title p{margin:4px 0 0;color:#75857b;font-size:.82rem} .bank-tags{display:flex;gap:7px;flex-wrap:wrap}.bank-tags span{padding:5px 9px;border-radius:999px;background:#f1f5f0;color:#526a5c;border:1px solid #e2e9e1;font-size:.75rem;font-weight:800} .bank-identifiers{display:grid;grid-template-columns:1fr 1fr;gap:8px}.bank-identifiers>div{display:grid;gap:5px;min-width:0;padding:11px 12px;border:1px solid #edf1eb;border-radius:12px;background:#fafcf9}.bank-identifiers span{font-size:.72rem;color:#809087}.bank-identifiers b{font-size:.85rem;overflow-wrap:anywhere}.bank-iban-row{grid-column:1/-1}.bank-meta-row{padding-top:2px;color:#718178;font-size:.78rem}.bank-meta-row b{color:#40584b}.bank-note{padding:10px 12px!important;border-radius:11px;background:#faf7ef;color:#746245!important;line-height:1.8} .bank-card-actions{display:flex;gap:7px;flex-wrap:wrap;padding-top:2px;border-top:1px solid #edf1eb}.bank-card-actions>button,.bank-card-actions>form{flex:1;min-width:120px}.bank-card-actions form button{width:100%} .bank-empty-state{grid-column:1/-1;display:grid;justify-items:center;gap:10px;padding:44px 20px}.bank-empty-state .icon{width:38px;height:38px;color:#30735e}.bank-empty-state strong{font-size:1.05rem}.bank-empty-state span{color:#718178} .bank-dialog{width:min(860px,calc(100vw - 28px));max-height:min(88vh,900px);padding:0;border:0;border-radius:22px;background:#fff;box-shadow:0 28px 80px rgba(11,47,39,.25);overflow:hidden;color:#183e35} .bank-dialog::backdrop{background:rgba(10,35,30,.58);backdrop-filter:blur(3px)}.bank-dialog-form{display:flex;flex-direction:column;max-height:88vh} .bank-dialog-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:21px 23px;border-bottom:1px solid #e7ece6;background:#fbfcfa}.bank-dialog-head h2{margin:3px 0 4px;font-size:1.25rem}.bank-dialog-head p{margin:0;color:#738278;font-size:.8rem}.dialog-close{width:38px;height:38px;min-height:38px;flex:0 0 auto;border:1px solid #e0e8df;border-radius:11px;background:#fff;color:#667a6d;font-size:23px;line-height:1;cursor:pointer} .bank-form-body{padding:20px 23px;overflow:auto;display:grid;gap:16px}.bank-form-section{margin:0;padding:16px;border:1px solid #e2e9e1;border-radius:15px;background:#fff}.bank-form-section legend{padding:0 8px;color:#255c4d;font-weight:900}.bank-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px 15px}.bank-form-grid label{display:grid;gap:7px;font-size:.82rem}.bank-form-grid .span-2{grid-column:1/-1}.bank-form-grid textarea{min-height:75px}.field-section-help{margin:-3px 0 12px;color:#7a8a80;font-size:.76rem}.bank-other-field.is-hidden{display:none}.bank-default-switch{grid-template-columns:auto 1fr!important;align-items:flex-start!important;gap:10px!important;padding:11px 12px;border:1px solid #dfe9df;border-radius:12px;background:#f7faf6;cursor:pointer}.bank-default-switch input{width:19px;height:19px;min-height:19px;margin-top:2px;accent-color:#176f5b}.bank-default-switch span{display:grid;gap:3px}.bank-default-switch b{font-size:.84rem}.bank-default-switch small{color:#718178;font-weight:500;line-height:1.7} .bank-dialog-actions{display:flex;justify-content:flex-end;gap:9px;padding:15px 23px;border-top:1px solid #e7ece6;background:#fbfcfa} @media(max-width:1050px){.section-hub-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.bank-grid-modern{grid-template-columns:1fr}} @media(max-width:760px){ .section-hub-hero{align-items:flex-start;padding:20px}.section-hub-icon{width:54px;height:54px;border-radius:16px}.section-hub-grid{grid-template-columns:1fr}.section-hub-card{min-height:112px;padding:17px}.section-hub-card-copy small{font-size:.78rem} .bank-page-heading{align-items:stretch}.bank-heading-actions{display:grid;grid-template-columns:1fr}.bank-overview{grid-template-columns:1fr}.bank-list-panel{padding:16px}.bank-list-head{gap:12px}.bank-security-note{width:100%}.bank-identifiers{grid-template-columns:1fr}.bank-iban-row{grid-column:auto}.bank-card-actions{display:grid;grid-template-columns:1fr}.bank-card-actions>button,.bank-card-actions>form{min-width:0;width:100%} .bank-dialog{width:calc(100vw - 16px);max-height:92vh;border-radius:18px}.bank-dialog-form{max-height:92vh}.bank-dialog-head{padding:17px}.bank-form-body{padding:15px}.bank-form-section{padding:13px}.bank-form-grid{grid-template-columns:1fr}.bank-form-grid .span-2{grid-column:auto}.bank-dialog-actions{padding:13px 15px;display:grid;grid-template-columns:1fr 1fr} } /* Banking ledger, opening balance and reconciliation */ .bank-overview{grid-template-columns:repeat(4,minmax(0,1fr))} .bank-balance-summary strong{font-size:1.32rem!important;direction:ltr;text-align:left} .bank-balance-card{display:grid;grid-template-columns:1.35fr .9fr;gap:12px;padding:14px;border:1px solid #dfeae1;border-radius:15px;background:linear-gradient(135deg,#f7fbf8,#fff)} .bank-balance-main,.bank-opening-meta{display:grid;gap:4px;align-content:center} .bank-balance-main span,.bank-opening-meta span{font-size:.73rem;color:#718279;font-weight:800} .bank-balance-main strong{font-size:1.42rem;line-height:1.2;color:#1e6653;direction:ltr;text-align:right} .bank-balance-main strong.is-negative{color:#a84343}.bank-balance-main strong small{font-size:.72rem;color:#718279;font-weight:800} .bank-balance-main>small,.bank-opening-meta>small{font-size:.68rem;color:#8a978f} .bank-opening-meta{padding-right:12px;border-right:1px solid #e4ebe4}.bank-opening-meta b{font-size:.86rem;color:#334e43} .bank-opening-meta .needs-opening{color:#a66d17}.bank-reconcile-status{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;padding:10px;border-radius:12px;border:1px solid #e5ebe5;background:#fafcf9} .bank-reconcile-status>div{display:grid;gap:3px;min-width:0}.bank-reconcile-status span{font-size:.66rem;color:#819087}.bank-reconcile-status b{font-size:.77rem;overflow-wrap:anywhere} .bank-reconcile-status.is-ok{border-color:#d2e9d8;background:#f3faf5}.bank-reconcile-status.is-ok>div:last-child b{color:#24704f} .bank-reconcile-status.has-diff{border-color:#f0dfbd;background:#fffaf0}.bank-reconcile-status.has-diff>div:last-child b{color:#9a651c} .bank-reconcile-status.is-empty{display:block;text-align:center;color:#829086;font-size:.74rem;padding:9px 12px} .bank-opening-section{border-color:#d6e8da;background:#fbfdfb}.bank-opening-required{border-color:#efdcb4;background:#fffbf2}.bank-opening-locked{background:#f8faf7} .opening-locked-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:9px}.opening-locked-grid>div{display:grid;gap:4px;padding:11px;border:1px solid #e4ebe3;border-radius:11px;background:#fff}.opening-locked-grid span{font-size:.72rem;color:#7b8a80}.opening-locked-grid strong{font-size:.9rem;color:#355247} .ledger-current-balance,.reconcile-book-preview{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 16px;border:1px solid #dce8df;border-radius:13px;background:#f7faf7}.ledger-current-balance span,.reconcile-book-preview span{color:#6e8075;font-size:.78rem;font-weight:800}.ledger-current-balance strong,.reconcile-book-preview strong{font-size:1.15rem;color:#1e6754;direction:ltr}.reconcile-book-preview{display:grid;grid-template-columns:1fr auto;gap:3px 14px}.reconcile-book-preview small{grid-column:1/-1;color:#87948c;font-size:.7rem} .bank-ledger-table{border:1px solid #e6ece6;border-radius:13px;overflow:auto}.bank-ledger-table table{margin:0;min-width:650px}.bank-ledger-table td,.bank-ledger-table th{font-size:.76rem}.bank-ledger-table .money-in{color:#19704f;font-weight:900;direction:ltr}.bank-ledger-table .money-out{color:#a04a4a;font-weight:900;direction:ltr}.ledger-ref{display:block;margin-top:3px;color:#89968e;font-size:.66rem}.reconcile-help{padding:10px 12px;border-radius:11px;background:#fff7e8;color:#846126;border:1px solid #efdfbd;font-size:.75rem;line-height:1.8} @media(max-width:1180px){.bank-overview{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:760px){.bank-overview{grid-template-columns:1fr}.bank-balance-card{grid-template-columns:1fr}.bank-opening-meta{padding:10px 0 0;border-right:0;border-top:1px solid #e4ebe4}.bank-reconcile-status{grid-template-columns:1fr}.opening-locked-grid{grid-template-columns:1fr}.ledger-current-balance{align-items:flex-start;flex-direction:column}.reconcile-book-preview{grid-template-columns:1fr}} .flash.warning{background:var(--ds-warning-soft,#fff7e8);color:var(--ds-warning,#8a6118);border-color:#efdcb4}.flash.warning span{background:#f9e8bd} /* Bank account multi-purpose selection + Persian smart bank search */ .bank-search-label{position:relative}.bank-search-label>small,.bank-usage-field>small{color:#7a8a80;font-size:.72rem;line-height:1.7} .bank-combobox{position:relative}.bank-combobox>input{padding-left:44px}.bank-combobox-toggle{position:absolute;left:7px;top:7px;width:34px;height:34px;min-height:34px;border:0;border-radius:9px;background:#eef5f0;color:#28614f;font-size:18px;cursor:pointer;display:grid;place-items:center} .bank-suggestions{position:absolute;z-index:30;top:calc(100% + 6px);right:0;left:0;max-height:250px;overflow:auto;padding:6px;border:1px solid #dfe8e0;border-radius:12px;background:#fff;box-shadow:0 16px 38px rgba(18,56,45,.16)} .bank-suggestions button{display:block;width:100%;min-height:38px;padding:8px 11px;border:0;border-radius:8px;background:transparent;color:#264e42;text-align:right;cursor:pointer;font:inherit;font-size:.8rem}.bank-suggestions button:hover,.bank-suggestions button:focus{background:#edf6f0;outline:none}.bank-suggestions button[hidden]{display:none}.bank-suggestions.is-empty::after{content:'نتیجه‌ای در فهرست استاندارد پیدا نشد؛ می‌توانید نام را دستی ثبت کنید.';display:block;padding:10px;color:#7c8b82;font-size:.74rem;line-height:1.7} .bank-usage-field{display:grid;gap:9px}.bank-usage-head{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:.82rem}.bank-usage-head>span{font-weight:700}.usage-select-all{display:inline-flex!important;grid-template-columns:auto auto!important;align-items:center!important;gap:6px!important;color:#25604f;font-size:.75rem!important;cursor:pointer}.usage-select-all input{width:17px;height:17px;min-height:17px;accent-color:#176f5b} .bank-usage-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.bank-usage-options label{display:flex!important;align-items:center!important;gap:8px!important;padding:10px 11px;border:1px solid #dfe8e0;border-radius:11px;background:#fafcf9;cursor:pointer;font-size:.77rem!important}.bank-usage-options label:has(input:checked){border-color:#9dc8b9;background:#eff8f3;color:#1e604c}.bank-usage-options input{width:18px;height:18px;min-height:18px;accent-color:#176f5b}.bank-usage-tag{background:#edf7f1!important;color:#25604f!important} .import-help-card{display:grid;gap:5px;padding:13px 15px;border:1px solid #dfe8e0;border-radius:13px;background:#f8fbf8}.import-help-card strong{color:#255c4d}.import-help-card span{color:#718178;font-size:.78rem;line-height:1.8}.import-error-list{display:grid;gap:7px;margin:0;padding:0 20px 0 0}.import-error-list li{color:#7f3d3d;line-height:1.8} @media(max-width:760px){.bank-usage-options{grid-template-columns:1fr}.bank-combobox-toggle{top:6px}} /* Section hub refinement: richer hover and clearer interaction feedback */ .section-hub-hero{border-color:#e3e9f1!important;background:linear-gradient(135deg,#ffffff 0%,#f9fbff 100%)!important;box-shadow:0 14px 32px rgba(31,47,70,.05)!important} .section-hub-icon{background:linear-gradient(135deg,#eef3ff 0%,#f7f9ff 100%)!important;color:#5b79cd!important;box-shadow:0 10px 26px rgba(102,132,213,.10)!important} .section-hub-copy h1{color:#1f2f46!important} .section-hub-copy p{color:#6f7f93!important} .section-hub-grid{gap:18px!important} .section-hub-card{ position:relative!important; min-height:138px!important; padding:22px!important; border:1px solid #e3e9f1!important; border-radius:22px!important; background:linear-gradient(180deg,#ffffff 0%,#fbfcff 100%)!important; color:#1f2f46!important; box-shadow:0 10px 28px rgba(31,47,70,.045)!important; overflow:hidden!important; } .section-hub-card:before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:linear-gradient(180deg,#6b89dc 0%,#83a0e9 100%);opacity:0;transition:opacity .18s ease} .section-hub-card:hover,.section-hub-card:focus-visible{transform:translateY(-4px)!important;border-color:#cfdcff!important;box-shadow:0 20px 42px rgba(102,132,213,.12)!important} .section-hub-card:hover:before,.section-hub-card:focus-visible:before{opacity:1} .section-hub-card-icon{background:linear-gradient(135deg,#f3f6ff 0%,#eef6ff 100%)!important;color:#5876cd!important;border:1px solid #dfe7fb!important;box-shadow:0 8px 18px rgba(102,132,213,.10)!important;transition:transform .18s ease,box-shadow .18s ease,background .18s ease!important} .section-hub-card:hover .section-hub-card-icon,.section-hub-card:focus-visible .section-hub-card-icon{transform:scale(1.06)!important;box-shadow:0 14px 26px rgba(102,132,213,.16)!important} .section-hub-card-copy strong{color:#1f2f46!important;font-size:1.02rem!important} .section-hub-card-copy small{color:#6f7f93!important;line-height:1.95!important;font-size:.84rem!important} .section-hub-arrow{color:#8fa0b5!important;transition:transform .18s ease,color .18s ease!important} .section-hub-card:hover .section-hub-arrow,.section-hub-card:focus-visible .section-hub-arrow{transform:translateX(-4px)!important;color:#5876cd!important} /* v20 slot builder + intelligent lottery */ .slot-builder-card,.lottery-control-card,.period-management-note{overflow:hidden} .slot-builder-form label small{display:block;margin-top:6px;color:var(--muted,#738079);font-size:11px;line-height:1.7} .slot-builder-actions{display:flex;gap:10px;flex-wrap:wrap} .slot-builder-preview{position:relative} .slot-builder-preview.is-ready{border-color:rgba(28,126,104,.22)} .slot-builder-preview.has-shortage{border-color:rgba(190,125,24,.26)} .slot-capacity-badge{display:inline-flex;align-items:center;padding:7px 11px;border-radius:999px;background:#f0f6f3;color:#2f6c5d;font-size:12px;font-weight:800} .slot-builder-metrics,.lottery-readiness-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:18px 0} .slot-builder-metrics article,.lottery-readiness-grid article{display:grid;gap:3px;padding:16px;border:1px solid #e4ebe7;border-radius:16px;background:linear-gradient(180deg,#fff,#fbfdfc);box-shadow:0 8px 24px rgba(31,69,55,.055)} .slot-builder-metrics article span,.lottery-readiness-grid article span{color:#6e7d76;font-size:12px} .slot-builder-metrics article b,.lottery-readiness-grid article b{color:#184c3f;font-size:24px;line-height:1.2} .slot-builder-metrics article small,.lottery-readiness-grid article small{color:#8a9690;font-size:11px} .slot-builder-warning{display:flex;gap:10px;align-items:flex-start;margin:12px 0 18px;padding:13px 14px;border:1px solid #ecd9ac;border-radius:13px;background:#fff9ec;color:#77591f} .slot-builder-warning span{font-size:12px;line-height:1.8} .slot-preview-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px} .slot-preview-item{display:flex;align-items:center;gap:12px;padding:13px 14px;border:1px solid #e4ebe7;border-radius:14px;background:#fff;box-shadow:0 5px 16px rgba(31,69,55,.04)} .slot-preview-no{width:34px;height:34px;display:grid;place-items:center;flex:0 0 34px;border-radius:11px;background:#eaf4f0;color:#206d5b;font-weight:900} .slot-preview-item>div{display:grid;gap:3px}.slot-preview-item b{font-size:13px}.slot-preview-item small{font-size:11px;color:#76847d} .slot-skip-details,.lottery-candidate-details{margin-top:16px;border-top:1px dashed #dfe7e2;padding-top:12px} .slot-skip-details summary,.lottery-candidate-details summary{cursor:pointer;color:#47665b;font-weight:800;font-size:12px} .slot-skip-list,.lottery-candidate-list{display:grid;gap:8px;margin-top:10px} .slot-skip-list>div,.lottery-candidate-list>div{display:flex;justify-content:space-between;gap:14px;padding:10px 12px;border-radius:11px;background:#f7f9f8;font-size:11px} .slot-skip-list span,.lottery-candidate-list span{color:#718078} .period-rule-cards,.lottery-rule-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px} .period-rule-cards>span,.lottery-rule-grid>article{display:grid;gap:4px;padding:14px;border:1px solid #e3ebe6;border-radius:14px;background:#fbfdfc} .period-rule-cards b,.lottery-rule-grid b{color:#245d4f}.period-rule-cards small,.lottery-rule-grid span{color:#738079;font-size:11px;line-height:1.8} .lottery-filter-form{align-items:end} .lottery-quarter-mode{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:8px} .lottery-quarter-mode>label{position:relative;margin:0;cursor:pointer} .lottery-quarter-mode input{position:absolute;opacity:0;pointer-events:none} .lottery-quarter-mode label>span{display:grid;gap:3px;min-height:78px;padding:13px 14px;border:1px solid #dfe7e2;border-radius:14px;background:#fbfdfc;transition:.15s ease} .lottery-quarter-mode label>span b{color:#365b50;font-size:13px}.lottery-quarter-mode label>span small{color:#7a8981;font-size:11px;line-height:1.7} .lottery-quarter-mode input:checked+span{border-color:#5b9b89;background:#eff7f4;box-shadow:0 8px 20px rgba(24,103,83,.10)} .lottery-entitlement-summary{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0 16px} .lottery-entitlement-summary span{display:inline-flex;align-items:center;gap:7px;padding:7px 10px;border-radius:999px;background:#f2f6f4;color:#587067}.lottery-entitlement-summary b{color:#1b6755}.lottery-entitlement-summary small{font-size:11px} .lottery-run-form{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:18px;padding-top:16px;border-top:1px solid #e5ebe8}.lottery-run-form p{margin:0;color:#708078;font-size:11px;line-height:1.8;flex:1 1 300px} .lottery-results-panel{border-color:rgba(31,126,104,.24)} .lottery-result-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px} .lottery-result-grid article{position:relative;display:grid;gap:4px;padding:16px;border:1px solid #dfe9e4;border-radius:15px;background:linear-gradient(180deg,#fff,#f9fcfa);box-shadow:0 8px 22px rgba(27,75,58,.055)} .lottery-result-grid article>b{color:#184f41}.lottery-result-grid article small{color:#5f746a}.lottery-result-grid article p{margin:3px 0 0;color:#7a8781;font-size:11px} .lottery-result-bundle{justify-self:start;padding:5px 8px;border-radius:999px;background:#eaf5f1;color:#216a58;font-size:10px;font-weight:900} .lottery-rule-grid{grid-template-columns:repeat(4,minmax(0,1fr))} .inline-allocation-form .muted{display:block;line-height:1.8} @media(max-width:900px){ .slot-builder-metrics,.lottery-readiness-grid{grid-template-columns:repeat(2,minmax(0,1fr))} .lottery-rule-grid{grid-template-columns:repeat(2,minmax(0,1fr))} .lottery-result-grid{grid-template-columns:repeat(2,minmax(0,1fr))} } @media(max-width:620px){ .slot-builder-metrics,.lottery-readiness-grid,.slot-preview-grid,.period-rule-cards,.lottery-quarter-mode,.lottery-result-grid,.lottery-rule-grid{grid-template-columns:1fr} .slot-skip-list>div,.lottery-candidate-list>div{display:grid;gap:4px} .lottery-run-form{display:grid}.lottery-run-form .button{width:100%} } /* ===== hammelk-soft-theme-v1.css ===== */ /* Hammelk White Minimal UI — intentionally neutral, bright and low-noise. */ :root{ --h-ink:#1f2937; --h-muted:#6b7280; --h-soft:#f7f8fa; --h-soft-2:#f3f4f6; --h-line:#e5e7eb; --h-line-strong:#d8dde4; --h-primary:#0f766e; --h-primary-hover:#0b625b; --h-primary-soft:#edf7f6; --h-danger:#b42318; --h-danger-soft:#fff4f2; --h-warning:#9a6700; --h-warning-soft:#fff9e8; --h-shadow:0 4px 18px rgba(17,24,39,.035); --ds-primary:var(--h-primary); --ds-primary-hover:var(--h-primary-hover); --ds-primary-soft:var(--h-primary-soft); --ds-bg:#fff; --ds-surface:#fff; --ds-text:var(--h-ink); --ds-muted:var(--h-muted); --ds-border:var(--h-line); --ds-shadow:var(--h-shadow); --primary:var(--h-primary); --primary-2:var(--h-primary-hover); --bg:#fff; --surface:#fff; --surface-2:var(--h-soft); --text:var(--h-ink); --muted:var(--h-muted); --line:var(--h-line); --shadow:var(--h-shadow); } html,body{background:#fff!important;color:var(--h-ink)} body{background-image:none!important} .app-shell,.workspace,.page-content{background:#fff!important} .page-content{padding-top:24px} /* Sidebar */ .app-shell .sidebar{ background:#fff!important;color:var(--h-ink)!important; border-left:1px solid var(--h-line)!important;box-shadow:none!important; } .app-shell .brand{border-bottom-color:var(--h-line)!important} .app-shell .brand-copy strong,.app-shell .brand-copy span{color:var(--h-ink)!important} .app-shell .brand-separator{color:#b8bec7!important} .app-shell .sidebar-property.suite-overview{ background:#fff!important;border:1px solid var(--h-line)!important;box-shadow:none!important; } .app-shell .sidebar-property small,.app-shell .account-copy small{color:var(--h-muted)!important} .app-shell .property-year{background:var(--h-soft)!important;color:#4b5563!important;border:1px solid var(--h-line)!important} .app-shell .suite-overview-item{background:#fff!important;border:1px solid var(--h-line)!important;color:#374151!important} .app-shell .organized-menu .menu-section{ background:transparent!important;border:1px solid transparent!important;color:#4b5563!important;box-shadow:none!important; } .app-shell .organized-menu .menu-section>.icon{color:#7b8491!important} .app-shell .organized-menu .menu-section:hover{background:var(--h-soft)!important;border-color:var(--h-line)!important;color:var(--h-ink)!important} .app-shell .organized-menu .menu-section.active{ background:var(--h-soft-2)!important;border-color:var(--h-line)!important;color:var(--h-ink)!important; box-shadow:inset -3px 0 var(--h-primary)!important; } .app-shell .organized-menu .menu-section.active>.icon{color:var(--h-primary)!important} .app-shell .menu-open-mark{color:#9aa2ad!important} .app-shell .sidebar-footer{border-top-color:var(--h-line)!important;background:#fff!important} .app-shell .sidebar-account{color:var(--h-ink)!important} .app-shell .avatar{background:var(--h-soft-2)!important;color:#374151!important;border:1px solid var(--h-line)!important} .app-shell .logout-link{color:#9b4b45!important} .app-shell .logout-link:hover{background:var(--h-danger-soft)!important;color:var(--h-danger)!important} /* Topbar */ .app-shell .topbar,.app-shell .topbar.topbar-premium{ background:#fff!important;border:1px solid var(--h-line)!important;border-top:0!important; box-shadow:none!important;backdrop-filter:none!important; } .app-shell .topbar::before,.app-shell .topbar::after{display:none!important} .app-shell .topbar-premium .topbar-brand-name{color:#7a5d2f!important} .app-shell .topbar-premium .topbar-title b{color:var(--h-ink)!important} .app-shell .topbar-meta small{color:var(--h-muted)!important} .app-shell .topbar-suite-chip{background:#fff!important;border:1px solid var(--h-line)!important;color:#4b5563!important;box-shadow:none!important} .app-shell .icon-button{background:#fff!important;border:1px solid var(--h-line)!important;color:#4b5563!important;box-shadow:none!important} .app-shell .icon-button:hover{background:var(--h-soft)!important;color:var(--h-ink)!important} /* Universal surfaces */ .app-shell .panel,.app-shell .card,.app-shell .ds-card,.app-shell .settings-section-card, .app-shell .maintenance-card,.app-shell .section-hub-card,.app-shell .section-hub-hero, .app-shell .simple-card,.app-shell .bank-card,.app-shell .calendar-control-card, .app-shell .calendar-month-card,.app-shell .calendar-agenda-card,.app-shell .calendar-settings-hero{ background:#fff!important;border:1px solid var(--h-line)!important;box-shadow:var(--h-shadow)!important; } .app-shell .eyebrow,.app-shell .panel-kicker{color:#7a5d2f!important} .app-shell h1,.app-shell h2,.app-shell h3,.app-shell h4{color:var(--h-ink)!important} .app-shell p,.app-shell small,.app-shell .helper-text{color:var(--h-muted)} .app-shell hr{border-color:var(--h-line)!important} /* Inputs */ .app-shell input,.app-shell select,.app-shell textarea{ background:#fff!important;color:var(--h-ink)!important;border:1px solid var(--h-line-strong)!important;box-shadow:none!important; } .app-shell input::placeholder,.app-shell textarea::placeholder{color:#a0a7b1!important} .app-shell input:focus,.app-shell select:focus,.app-shell textarea:focus{ border-color:#8abdb8!important;box-shadow:0 0 0 3px rgba(15,118,110,.08)!important;outline:none!important; } .app-shell input[type=checkbox],.app-shell input[type=radio]{accent-color:var(--h-primary)} /* Buttons */ .app-shell .button.primary,.app-shell button.primary, .app-shell button.button:not(.secondary):not(.ghost-danger):not(.danger):not(.icon-button):not(.modal-close):not(.sidebar-install):not(.text-button):not(.group-toggle):not(.sidebar-close):not(.menu-button):not(.button-secondary):not(.button-danger){ background:var(--h-primary)!important;color:#fff!important;border-color:var(--h-primary)!important;box-shadow:none!important; } .app-shell .button.primary:hover,.app-shell button.primary:hover, .app-shell button.button:not(.secondary):not(.ghost-danger):not(.danger):not(.icon-button):not(.modal-close):not(.sidebar-install):not(.text-button):not(.group-toggle):not(.sidebar-close):not(.menu-button):not(.button-secondary):not(.button-danger):hover{ background:var(--h-primary-hover)!important;box-shadow:none!important; } .app-shell .button.secondary,.app-shell button.secondary,.app-shell .button.soft{ background:#fff!important;color:#374151!important;border:1px solid var(--h-line-strong)!important;box-shadow:none!important; } .app-shell .button.secondary:hover,.app-shell button.secondary:hover,.app-shell .button.soft:hover{background:var(--h-soft)!important} .app-shell .button.danger,.app-shell button.danger{background:#fff!important;color:var(--h-danger)!important;border:1px solid #f1c8c4!important;box-shadow:none!important} .app-shell .button.danger:hover,.app-shell button.danger:hover{background:var(--h-danger-soft)!important} /* Section hub / dashboard / settings */ .app-shell .section-hub-hero{background:#fff!important} .app-shell .section-hub-icon,.app-shell .section-hub-card-icon,.app-shell .settings-section-icon,.app-shell .bank-emblem{ background:var(--h-soft)!important;color:#5f6874!important;border:1px solid var(--h-line)!important; } .app-shell .section-hub-card:hover{background:#fbfcfd!important;border-color:#d8dde4!important;transform:none!important;box-shadow:0 5px 16px rgba(17,24,39,.05)!important} .app-shell .section-hub-arrow{color:#9aa2ad!important} .app-shell .dashboard-commandbar,.app-shell .settings-hero{ background:#fff!important;color:var(--h-ink)!important;border:1px solid var(--h-line)!important;box-shadow:var(--h-shadow)!important; } .app-shell .dashboard-commandbar::before,.app-shell .dashboard-commandbar::after,.app-shell .settings-hero::before,.app-shell .settings-hero::after{display:none!important} .app-shell .dashboard-commandbar *,.app-shell .settings-hero *{text-shadow:none!important} .app-shell .rate-summary,.app-shell .lottery-cycle,.app-shell .design-preview,.app-shell .danger-panel{background:var(--h-soft)!important;border-color:var(--h-line)!important} .app-shell .settings-jump-nav{background:#fff!important;border:1px solid var(--h-line)!important;box-shadow:none!important} .app-shell .settings-jump-nav a{color:#4b5563!important} .app-shell .settings-jump-nav a:hover{background:var(--h-soft)!important;color:var(--h-ink)!important} /* Tables */ .app-shell .table-wrap,.app-shell table{background:#fff!important} .app-shell th{background:var(--h-soft)!important;color:#4b5563!important;border-color:var(--h-line)!important} .app-shell td{background:#fff!important;color:#374151!important;border-color:var(--h-line)!important} .app-shell tbody tr:hover td{background:#fbfcfd!important} /* Calendar: white grid with subtle status cues only */ .app-shell .calendar-hero,.app-shell .calendar-hero-pro,.app-shell .calendar-command-center{background:#fff!important;border-color:var(--h-line)!important;box-shadow:var(--h-shadow)!important} .app-shell .calendar-range-metrics>*,.app-shell .calendar-cache-status,.app-shell .calendar-today{background:var(--h-soft)!important;border-color:var(--h-line)!important;color:#4b5563!important} .app-shell .calendar-view-tabs{background:var(--h-soft)!important;border:1px solid var(--h-line)!important} .app-shell .calendar-view-tabs button{background:transparent!important;color:#6b7280!important;border:0!important} .app-shell .calendar-view-tabs button.active{background:#fff!important;color:var(--h-ink)!important;box-shadow:0 1px 4px rgba(17,24,39,.06)!important} .app-shell .calendar-grid{background:var(--h-line)!important;gap:1px!important;border:1px solid var(--h-line)!important} .app-shell .calendar-day{background:#fff!important;border:0!important;box-shadow:none!important;color:var(--h-ink)!important} .app-shell .calendar-day:hover{background:#fbfcfd!important} .app-shell .calendar-day.today{box-shadow:inset 0 0 0 2px rgba(15,118,110,.38)!important;background:#fbfefe!important} .app-shell .calendar-day.holiday,.app-shell .calendar-day.friday{background:#fffdfd!important} .app-shell .calendar-week-head{background:var(--h-soft)!important;color:#6b7280!important;border-color:var(--h-line)!important} .app-shell .day-item{background:var(--h-soft)!important;border-color:var(--h-line)!important;color:#4b5563!important} .app-shell .day-item.period{background:#f7fafc!important;border-right:3px solid #8fb4cb!important} .app-shell .day-item.event{background:#fbf8f2!important;border-right:3px solid #c6aa7a!important} .app-shell .day-item.occasion{background:#fafafa!important} .app-shell .holiday-mark{color:#b34a4a!important} .app-shell .calendar-day-panel,.app-shell .calendar-period-modal{background:#fff!important;border-color:var(--h-line)!important;box-shadow:-12px 0 34px rgba(17,24,39,.08)!important} .app-shell .calendar-overlay{background:rgba(17,24,39,.22)!important;backdrop-filter:blur(2px)!important} .app-shell .panel-section,.app-shell .period-form-section{background:#fff!important;border-color:var(--h-line)!important} .app-shell .suite-choice{background:#fff!important;border-color:var(--h-line)!important;color:#4b5563!important} .app-shell .suite-choice:has(input:checked){background:var(--h-soft)!important;border-color:#aeb7c2!important;color:var(--h-ink)!important} /* Bank / finance */ .app-shell .bank-overview>*,.app-shell .bank-balance-card,.app-shell .bank-opening-section,.app-shell .import-help-card, .app-shell .ledger-current-balance,.app-shell .reconcile-book-preview{background:#fff!important;border-color:var(--h-line)!important;box-shadow:none!important} .app-shell .bank-usage-options label{background:#fff!important;border-color:var(--h-line)!important;color:#4b5563!important} .app-shell .bank-usage-options label:has(input:checked){background:var(--h-soft)!important;border-color:#b6c0ca!important;color:var(--h-ink)!important} .app-shell .bank-usage-tag{background:var(--h-soft)!important;color:#4b5563!important} .app-shell .bank-suggestions{border-color:var(--h-line)!important;box-shadow:0 10px 28px rgba(17,24,39,.08)!important} .app-shell .bank-suggestions button:hover{background:var(--h-soft)!important} /* Flash / loader */ .app-shell .flash{box-shadow:none!important;border:1px solid var(--h-line)!important} .app-shell .flash.success{background:#f3fbf7!important;color:#246b4c!important;border-color:#d8eee1!important} .app-shell .flash.danger{background:var(--h-danger-soft)!important;color:#9b2c25!important;border-color:#f1cfcb!important} .app-shell .flash.warning{background:var(--h-warning-soft)!important;color:#7b5b10!important;border-color:#f1dfaa!important} .global-wait-overlay{background:rgba(17,24,39,.24)!important;backdrop-filter:blur(2px)!important} .global-wait-card{background:#fff!important;border:1px solid var(--h-line)!important;box-shadow:0 18px 45px rgba(17,24,39,.14)!important} .global-wait-spinner{border-color:#e5e7eb!important;border-top-color:var(--h-primary)!important} /* Mobile dock */ .app-shell .mobile-dock,.mobile-dock{background:#fff!important;border-top:1px solid var(--h-line)!important;box-shadow:0 -4px 16px rgba(17,24,39,.035)!important} .mobile-dock a,.mobile-dock button{color:#6b7280!important} .mobile-dock a.active{background:var(--h-soft)!important;color:var(--h-primary)!important} .sidebar-backdrop{background:rgba(17,24,39,.26)!important} /* Backup manager */ .backup-page{display:grid;gap:18px;max-width:1180px;margin:0 auto} .plain-page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:24px;border:1px solid var(--h-line);border-radius:18px;background:#fff} .plain-page-head h1{margin:6px 0 8px}.plain-page-head p{margin:0;max-width:760px;line-height:1.9} .security-badge{display:inline-flex;align-items:center;min-height:36px;padding:0 12px;border:1px solid #c9dfdc;border-radius:999px;background:#f5fbfa;color:var(--h-primary);font-weight:800;direction:ltr} .backup-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px} .summary-tile{display:grid;gap:8px;padding:18px;border:1px solid var(--h-line);border-radius:15px;background:#fff}.summary-tile span{color:var(--h-muted);font-size:.78rem}.summary-tile strong{font-size:1.05rem;color:var(--h-ink)} .backup-actions-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.simple-card{padding:22px;border-radius:18px}.simple-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:12px}.simple-card-head h2{margin:5px 0 0;font-size:1.05rem} .form-stack{display:grid;gap:12px}.form-stack label{display:grid;gap:7px}.form-stack label>span{font-weight:800;font-size:.78rem;color:#4b5563}.two-field-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.inline-notice{padding:10px 12px;border:1px solid var(--h-line);border-radius:11px;background:var(--h-soft);color:#667085;font-size:.75rem;line-height:1.8} .status-line{display:flex;gap:8px;align-items:center;padding:10px 12px;margin-bottom:14px;border-radius:11px;font-size:.76rem}.status-line span{width:8px;height:8px;border-radius:50%}.status-line.success{background:#f4fbf7;color:#346a50;border:1px solid #dceee3}.status-line.success span{background:#4e9a6f}.status-line.warning{background:#fff9e8;color:#795e1c;border:1px solid #f1dfaa}.status-line.warning span{background:#c99624} .switch-row{display:flex!important;align-items:center;justify-content:space-between;gap:18px;padding:13px 14px;border:1px solid var(--h-line);border-radius:12px;background:#fff}.switch-row>span{display:grid;gap:3px}.switch-row input{width:20px;height:20px;min-height:20px} .backup-list{display:grid;gap:10px}.backup-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px;border:1px solid var(--h-line);border-radius:13px;background:#fff}.backup-file-main{display:grid;gap:5px;min-width:0}.backup-file-main strong{overflow-wrap:anywhere}.backup-file-main small{color:var(--h-muted)}.backup-file-main code{font-size:.7rem;color:#818895;direction:ltr;text-align:right}.backup-row-actions{display:flex;align-items:center;gap:8px}.delete-backup-form{display:flex;align-items:center;gap:7px}.delete-backup-form input{width:130px;min-height:34px!important;padding:6px 9px!important}.button.small{min-height:34px!important;padding:6px 11px!important;font-size:.75rem!important} .restore-warning{padding:13px 15px;margin-bottom:14px;border:1px solid #f0d2ce;border-radius:12px;background:#fff8f7}.restore-warning strong{color:#9b2c25}.restore-warning p{margin:5px 0 0;line-height:1.8}.cell-note{display:block;margin-top:4px}.backup-page code{font-family:Consolas,monospace} @media(max-width:980px){.backup-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.backup-actions-grid{grid-template-columns:1fr}} @media(max-width:700px){.plain-page-head{padding:18px}.security-badge{display:none}.backup-summary-grid{grid-template-columns:1fr 1fr}.two-field-grid{grid-template-columns:1fr}.backup-row{align-items:stretch;flex-direction:column}.backup-row-actions,.delete-backup-form{width:100%}.delete-backup-form input{flex:1;width:auto}.backup-row-actions{flex-wrap:wrap}} @media(max-width:460px){.backup-summary-grid{grid-template-columns:1fr}} /* Login follows the same white minimal language. */ .auth-page.login-v4{background:#fff!important;color:var(--h-ink)!important} .login-v4 .login-v4__story{background:#f7f8fa!important;color:var(--h-ink)!important;border-left:1px solid var(--h-line)!important} .login-v4 .login-v4__story::before,.login-v4 .login-v4__story::after{display:none!important} .login-v4 .login-v4__brand-mark{background:#fff!important;color:var(--h-primary)!important;border:1px solid var(--h-line)!important;box-shadow:none!important} .login-v4 .login-v4__brand-copy strong,.login-v4 .login-v4__story-title{color:var(--h-ink)!important} .login-v4 .login-v4__brand-copy small,.login-v4 .login-v4__story-lead,.login-v4 .login-v4__story-footer,.login-v4 .login-v4__scene-caption{color:var(--h-muted)!important} .login-v4 .login-v4__kicker,.login-v4 .login-v4__story-title em{color:var(--h-primary)!important} .login-v4 .login-v4__kicker-line{background:var(--h-primary)!important} .login-v4 .login-v4__scene{background:#fff!important;border:1px solid var(--h-line)!important;box-shadow:none!important;backdrop-filter:none!important} .login-v4 .login-v4__art-soft{stroke:#b9c1ca!important}.login-v4 .login-v4__art-gold{stroke:#6b8f89!important}.login-v4 .login-v4__art-dot{fill:#6b8f89!important} .login-v4 .login-v4__story-footer{border-top-color:var(--h-line)!important}.login-v4 .login-v4__story-footer b{color:var(--h-primary)!important} .login-v4 .login-v4__form-pane{background:#fff!important} .login-v4 .login-v4__card{border:1px solid var(--h-line)!important;border-radius:22px!important;box-shadow:0 8px 28px rgba(17,24,39,.055)!important} .login-v4 .login-v4__welcome{background:var(--h-soft)!important;color:#4b5563!important}.login-v4 .login-v4__welcome-dot{background:var(--h-primary)!important;box-shadow:none!important} .login-v4 .login-v4__card-header h2{color:var(--h-ink)!important}.login-v4 .login-v4__card-header p{color:var(--h-muted)!important} .login-v4 .login-v4__account-type legend,.login-v4 .login-v4__field>label{color:#4b5563!important} .login-v4 .login-v4__segmented{background:var(--h-soft)!important;border-color:var(--h-line)!important} .login-v4 .login-v4__segmented label>span{color:#6b7280!important}.login-v4 .login-v4__segmented input:checked+span{background:#fff!important;border-color:var(--h-line-strong)!important;color:var(--h-ink)!important;box-shadow:none!important} .login-v4 .login-v4__field-control input:not([type=checkbox]){background:#fff!important;color:var(--h-ink)!important;border-color:var(--h-line-strong)!important} .login-v4 .login-v4__field-control input:not([type=checkbox]):focus{border-color:#8abdb8!important;box-shadow:0 0 0 3px rgba(15,118,110,.08)!important} .login-v4 .login-v4__field-icon{stroke:#8b949f!important}.login-v4 .login-v4__password-toggle:hover{background:var(--h-soft)!important;color:var(--h-primary)!important} .login-v4 .login-v4__submit.button{background:var(--h-primary)!important;box-shadow:none!important}.login-v4 .login-v4__submit:hover{background:var(--h-primary-hover)!important;transform:none!important;box-shadow:none!important} .login-v4 .login-v4__help{background:var(--h-soft)!important;color:#667085!important}.login-v4 .login-v4__help svg{color:#7b8491!important}.login-v4 .login-v4__copyright{color:#8a929d!important} /* ===== hammelk-modern-v4.css ===== */ /* Hammelk Modern UI v4 A white, quiet, high-density admin shell. Loaded last to normalize legacy layers. */ :root{ --hm-bg:#fff; --hm-surface:#fff; --hm-subtle:#f8fafc; --hm-subtle-2:#f3f5f7; --hm-line:#e6e9ee; --hm-line-strong:#d8dde5; --hm-text:#20252b; --hm-muted:#707782; --hm-primary:#147d73; --hm-primary-hover:#10675f; --hm-primary-soft:#eef8f7; --hm-danger:#b33b32; --hm-warning:#8b6517; --hm-radius:14px; --hm-radius-lg:18px; --hm-shadow:0 8px 24px rgba(18,27,38,.045); --hm-shell:252px; --ds-bg:#fff!important; --ds-surface:#fff!important; --ds-surface-alt:var(--hm-subtle)!important; --ds-border:var(--hm-line)!important; --ds-text:var(--hm-text)!important; --ds-muted:var(--hm-muted)!important; --ds-shadow:var(--hm-shadow)!important; --bg:#fff!important; --surface:#fff!important; --surface-2:var(--hm-subtle)!important; --text:var(--hm-text)!important; --muted:var(--hm-muted)!important; --line:var(--hm-line)!important; --primary:var(--hm-primary)!important; } html{background:#fff!important;scroll-padding-top:78px!important} body{background:#fff!important;background-image:none!important;color:var(--hm-text)!important} body::before,body::after{display:none!important} .app-shell,.workspace,.page-content{background:#fff!important} /* --- Shell --- */ .app-shell .sidebar{ width:var(--hm-shell)!important; padding:14px 12px 12px!important; background:#fff!important; color:var(--hm-text)!important; border-left:1px solid var(--hm-line)!important; box-shadow:none!important; } .app-shell .brand{ min-height:50px!important; padding:0 7px 13px!important; border-bottom:1px solid var(--hm-line)!important; } .app-shell .brand-copy-inline{display:flex!important;align-items:center!important;gap:7px!important;white-space:nowrap} .app-shell .brand-copy strong{font-size:.95rem!important;color:#20252b!important} .app-shell .brand-copy span{font-size:.68rem!important;color:#8a9099!important} .app-shell .brand-separator{font-size:.55rem!important;color:#c1c5ca!important} .app-shell .sidebar-property.suite-overview{ margin:13px 1px 10px!important;padding:11px!important; border:1px solid var(--hm-line)!important;border-radius:12px!important; background:#fff!important;box-shadow:none!important; } .app-shell .suite-overview-head{margin-bottom:8px!important} .app-shell .suite-overview-head small{font-size:.67rem!important;color:#8a9099!important} .app-shell .property-year{ padding:3px 7px!important;border-radius:7px!important; background:var(--hm-subtle)!important;border:1px solid var(--hm-line)!important; color:#69717c!important;font-size:.68rem!important; } .app-shell .suite-overview-list{gap:6px!important} .app-shell .suite-overview-item{ min-height:34px!important;padding:6px 8px!important;border-radius:9px!important; background:#fff!important;border:1px solid var(--hm-line)!important;color:#3a4048!important; } .app-shell .suite-overview-item b{font-size:.7rem!important} .suite-color-dot{width:7px!important;height:7px!important;box-shadow:none!important} .suite-color-dot.blue{background:#75b8df!important}.suite-color-dot.pink{background:#e995b3!important}.suite-color-dot.green{background:#81b9a0!important} .app-shell .sidebar-nav{padding:4px 0 8px!important;gap:2px!important} .app-shell .organized-menu .menu-section{ min-height:43px!important;margin:0!important;padding:8px 10px!important; border-radius:10px!important;border:1px solid transparent!important; background:#fff!important;color:#4d5560!important;box-shadow:none!important; transform:none!important;transition:background .15s,border-color .15s,color .15s!important; } .app-shell .organized-menu .menu-section>.icon{width:18px!important;height:18px!important;color:#8a929c!important} .app-shell .organized-menu .menu-section:hover{ background:var(--hm-subtle)!important;border-color:var(--hm-line)!important;color:#22272e!important; } .app-shell .organized-menu .menu-section.active{ background:var(--hm-subtle-2)!important;border-color:var(--hm-line)!important; color:#20252b!important;box-shadow:inset -3px 0 var(--hm-primary)!important; } .app-shell .organized-menu .menu-section.active>.icon{color:var(--hm-primary)!important} .app-shell .menu-open-mark{color:#b1b7bf!important} .app-shell .sidebar-footer{background:#fff!important;border-top:1px solid var(--hm-line)!important;padding-top:9px!important} .app-shell .sidebar-account{padding:7px!important}.app-shell .sidebar-account:hover{background:var(--hm-subtle)!important} .app-shell .avatar{background:#fff!important;border:1px solid var(--hm-line-strong)!important;color:#4e5661!important;box-shadow:none!important} .app-shell .logout-link{color:#a24a43!important}.app-shell .logout-link:hover{background:#fff6f5!important;color:var(--hm-danger)!important} /* Header starts at the highest content point, like a professional desktop app. */ .app-shell .workspace{margin-right:var(--hm-shell)!important;min-width:0!important} .app-shell .topbar,.app-shell .topbar.topbar-modern{ position:sticky!important;top:0!important;z-index:40!important; width:100%!important;height:62px!important;margin:0!important; padding:0 clamp(16px,2.3vw,32px)!important; border:0!important;border-bottom:1px solid var(--hm-line)!important;border-radius:0!important; background:rgba(255,255,255,.98)!important;box-shadow:none!important;backdrop-filter:saturate(130%) blur(10px)!important; display:flex!important;align-items:center!important;gap:14px!important; } .app-shell .topbar::before,.app-shell .topbar::after{display:none!important} .app-shell .topbar-title{display:grid!important;gap:2px!important;min-width:0!important} .app-shell .topbar-title>b{font-size:.95rem!important;color:#20252b!important;line-height:1.3!important} .app-shell .topbar-meta{display:flex!important;align-items:center!important;gap:6px!important;font-size:.64rem!important;color:#8a9099!important} .app-shell .topbar-meta i{width:3px!important;height:3px!important;border-radius:50%!important;background:#c4c8ce!important} .app-shell .topbar-actions{margin-right:auto!important;display:flex!important;align-items:center!important;gap:7px!important} .app-shell .topbar-quick{ display:flex!important;align-items:center!important;gap:6px!important;min-height:34px!important; padding:0 10px!important;border:1px solid var(--hm-line)!important;border-radius:9px!important; background:#fff!important;color:#59616c!important;text-decoration:none!important;font-size:.7rem!important;font-weight:800!important; } .app-shell .topbar-quick:hover{background:var(--hm-subtle)!important;color:#20252b!important} .app-shell .topbar-quick .icon{width:16px!important;height:16px!important} .app-shell .icon-button,.app-shell .notification-bell,.app-shell .small-avatar{ width:36px!important;height:36px!important;min-height:36px!important;border-radius:9px!important; border:1px solid var(--hm-line)!important;background:#fff!important;color:#59616c!important;box-shadow:none!important; } .app-shell .icon-button:hover,.app-shell .notification-bell:hover{background:var(--hm-subtle)!important;color:#20252b!important} .app-shell .notification-count{background:#c6453c!important;color:#fff!important;box-shadow:0 0 0 2px #fff!important} .app-shell .menu-button{display:none!important} /* Content density */ .app-shell .page-content{ width:100%!important;max-width:1480px!important; margin:0 auto!important;padding:24px clamp(18px,2.4vw,34px) 52px!important; background:#fff!important;animation:none!important; } .app-shell .page-content>:first-child{margin-top:0!important} /* --- Universal visual language --- */ .app-shell .panel,.app-shell .card,.app-shell .ds-card,.app-shell .settings-section-card, .app-shell .maintenance-card,.app-shell .section-hub-card,.app-shell .section-hub-hero, .app-shell .simple-card,.app-shell .bank-card,.app-shell .calendar-control-card, .app-shell .calendar-month-card,.app-shell .calendar-agenda-card,.app-shell .calendar-settings-hero, .app-shell .dashboard-commandbar,.app-shell .settings-hero,.app-shell .plain-page-head, .app-shell .page-hero-minimal{ background:#fff!important;border:1px solid var(--hm-line)!important;border-radius:var(--hm-radius-lg)!important; box-shadow:none!important;color:var(--hm-text)!important; } .app-shell .panel,.app-shell .card,.app-shell .simple-card{padding:22px!important} .app-shell h1,.app-shell h2,.app-shell h3,.app-shell h4{color:#20252b!important;letter-spacing:-.015em} .app-shell p,.app-shell .helper-text,.app-shell small{color:var(--hm-muted)} .app-shell .eyebrow,.app-shell .panel-kicker{color:#79808a!important;font-size:.68rem!important;letter-spacing:0!important} .app-shell .section-hub-hero,.app-shell .dashboard-commandbar,.app-shell .settings-hero{padding:24px!important} .app-shell .section-hub-card,.app-shell .settings-section-card{transition:border-color .15s,background .15s!important;transform:none!important} .app-shell .section-hub-card:hover,.app-shell .settings-section-card:hover{background:#fcfcfd!important;border-color:#cfd5dd!important;box-shadow:none!important;transform:none!important} .app-shell .section-hub-icon,.app-shell .section-hub-card-icon,.app-shell .settings-section-icon,.app-shell .stat-icon,.app-shell .bank-emblem{ background:var(--hm-subtle)!important;border:1px solid var(--hm-line)!important;color:#6d7580!important;box-shadow:none!important; } /* Inputs and actions */ .app-shell input:not([type=checkbox]):not([type=radio]):not([type=hidden]),.app-shell select,.app-shell textarea{ min-height:44px!important;border:1px solid var(--hm-line-strong)!important;border-radius:10px!important; background:#fff!important;color:#282e35!important;box-shadow:none!important; } .app-shell input:focus,.app-shell select:focus,.app-shell textarea:focus{ border-color:#7ab5af!important;box-shadow:0 0 0 3px rgba(20,125,115,.08)!important;outline:none!important; } .app-shell label{color:#4e5661!important} .app-shell .button,.app-shell button{min-height:40px!important;border-radius:10px!important;box-shadow:none!important;transform:none!important} .app-shell .button.primary,.app-shell button.primary, .app-shell button.button:not(.secondary):not(.ghost-danger):not(.danger):not(.icon-button):not(.modal-close):not(.sidebar-install):not(.text-button):not(.group-toggle):not(.sidebar-close):not(.menu-button):not(.button-secondary):not(.button-danger):not(.owner-result):not(.calendar-panel-close):not(.owner-clear){ background:var(--hm-primary)!important;color:#fff!important;border-color:var(--hm-primary)!important; } .app-shell .button.primary:hover,.app-shell button.primary:hover{background:var(--hm-primary-hover)!important} .app-shell .button.secondary,.app-shell button.secondary,.app-shell .button.soft{ background:#fff!important;color:#424a54!important;border:1px solid var(--hm-line-strong)!important; } .app-shell .button.secondary:hover,.app-shell button.secondary:hover,.app-shell .button.soft:hover{background:var(--hm-subtle)!important} .app-shell .button.danger,.app-shell button.danger{background:#fff!important;border:1px solid #eac7c3!important;color:var(--hm-danger)!important} .app-shell .button.danger:hover,.app-shell button.danger:hover{background:#fff6f5!important} .app-shell .flash{border-radius:11px!important;box-shadow:none!important} /* Tables */ .app-shell .table-wrap{border:1px solid var(--hm-line)!important;border-radius:13px!important;box-shadow:none!important} .app-shell th{background:var(--hm-subtle)!important;color:#626a74!important;border-color:var(--hm-line)!important} .app-shell td{background:#fff!important;color:#333a43!important;border-color:var(--hm-line)!important} .app-shell tbody tr:hover td{background:#fbfcfd!important} /* --- Calendar: a clean productivity grid, never a green wall --- */ .app-shell .calendar-workspace{display:grid!important;gap:14px!important} .app-shell .calendar-overview,.app-shell .calendar-toolbar-card,.app-shell .calendar-board, .app-shell .calendar-agenda,.app-shell .calendar-settings-shell{ background:#fff!important;border:1px solid var(--hm-line)!important;border-radius:16px!important;box-shadow:none!important; } .app-shell .calendar-overview{padding:18px 20px!important} .app-shell .calendar-overview h1{font-size:1.2rem!important;margin:4px 0 5px!important} .app-shell .calendar-overview p{margin:0!important;font-size:.75rem!important} .app-shell .calendar-toolbar-card{padding:12px!important} .app-shell .calendar-week-head{background:var(--hm-subtle)!important;border-color:var(--hm-line)!important;color:#747c86!important} .app-shell .calendar-grid{background:var(--hm-line)!important;border:1px solid var(--hm-line)!important;gap:1px!important} .app-shell .calendar-day{ background:#fff!important;color:#313840!important;border:0!important;box-shadow:none!important;min-height:118px!important; } .app-shell .calendar-day:hover{background:#fafbfc!important;box-shadow:inset 0 0 0 1px #d9dee5!important} .app-shell .calendar-day.today{background:#f7fbfa!important;box-shadow:inset 0 0 0 2px #72aaa5!important} .app-shell .calendar-day.holiday,.app-shell .calendar-day.friday{background:#fffafa!important} .app-shell .calendar-day.empty{background:#fafbfc!important} .app-shell .day-number{color:#343b43!important} .app-shell .day-item{ background:#f8f9fb!important;border:1px solid var(--hm-line)!important;border-radius:7px!important;color:#535b65!important; box-shadow:none!important; } .app-shell .day-item.period{background:#f3f8fb!important;border-right:3px solid #7bb4d2!important} .app-shell .day-item.event{background:#fbf8f2!important;border-right:3px solid #d2af73!important} .app-shell .day-item.occasion{background:#f9fafb!important;border-right:3px solid #c9cdd3!important} .app-shell .calendar-view-tabs{background:var(--hm-subtle)!important;border:1px solid var(--hm-line)!important;border-radius:10px!important} .app-shell .calendar-view-tabs a,.app-shell .calendar-view-tabs button{color:#69717b!important} .app-shell .calendar-view-tabs .active,.app-shell .calendar-view-tabs a.active,.app-shell .calendar-view-tabs button.active{ background:#fff!important;color:#252b32!important;border-color:var(--hm-line)!important;box-shadow:0 1px 3px rgba(18,27,38,.06)!important; } .app-shell .calendar-day-panel,.app-shell .calendar-period-modal,.app-shell .calendar-drawer,.app-shell .calendar-workflow-drawer{ background:#fff!important;border-color:var(--hm-line)!important;box-shadow:-18px 0 45px rgba(18,27,38,.10)!important; } .app-shell .calendar-overlay{background:rgba(29,34,40,.22)!important;backdrop-filter:blur(2px)!important} /* Backup center */ .page-hero-minimal{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:22px!important} .page-hero-minimal h1{margin:5px 0 7px!important;font-size:1.28rem!important}.page-hero-minimal p{margin:0!important;max-width:760px;line-height:1.85} .hero-badges{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end} .neutral-badge,.success-badge,.warning-badge,.path-tag,.status-pill,.file-kind{display:inline-flex;align-items:center;min-height:28px;padding:0 9px;border-radius:999px;border:1px solid var(--hm-line);background:#fff;font-size:.68rem;font-weight:800;color:#69717b} .success-badge,.status-pill.ok{background:#f2faf7;border-color:#d8ece5;color:#2f735e}.warning-badge{background:#fff9ee;border-color:#f0dfbd;color:#84611b} .backup-path-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.backup-path-card{position:relative;display:flex;flex-direction:column;gap:12px}.backup-path-card form{margin-top:auto} .backup-path-icon{position:absolute;left:18px;top:18px;font:800 .7rem/1 Consolas,monospace;color:#a0a6ae}.path-tag{background:var(--hm-subtle)}.primary-path{border-color:#cfe4e1!important}.primary-path .path-tag{background:var(--hm-primary-soft);border-color:#d4ebe8;color:#417770} .crypto-install-row{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:end}.crypto-install-row input{min-width:0} .auto-backup-form{display:grid;grid-template-columns:1.5fr .6fr .8fr auto;gap:10px;align-items:end}.auto-backup-form>label:not(.switch-row){display:grid;gap:6px}.auto-backup-form .switch-row{height:100%} .status-line>div{display:grid;gap:2px}.status-line>div small{font-size:.69rem}.backup-file-title{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.file-kind.encrypted{background:#f2faf7;border-color:#d8ece5;color:#34705d}.file-kind.plain{background:#f8f9fb;color:#6f7680} .backup-preview-box{padding:14px;border:1px solid #cfe4e1;border-radius:12px;background:#f8fcfb;display:grid;gap:12px}.backup-preview-box.error{background:#fff7f6;border-color:#eccbc7}.preview-state{display:flex;align-items:center;gap:9px}.preview-dot{width:9px;height:9px;border-radius:50%;background:#5ca08a}.backup-preview-box.error .preview-dot{background:#c65c52}.preview-state>div{display:grid;gap:2px}.preview-state small{font-size:.7rem}.preview-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.preview-metrics span{padding:9px;border:1px solid var(--hm-line);border-radius:9px;background:#fff;display:grid;gap:3px}.preview-metrics small{font-size:.62rem}.preview-metrics b{font-size:.85rem} /* Mobile */ @media(max-width:1100px){ .backup-path-grid{grid-template-columns:1fr 1fr}.backup-path-grid>.backup-path-card:last-child{grid-column:1/-1} .auto-backup-form{grid-template-columns:1fr 1fr}.auto-backup-form .switch-row{grid-column:1/-1} } @media(max-width:900px){ .app-shell .sidebar{width:min(310px,88vw)!important;transform:translateX(110%)!important;z-index:70!important} .sidebar-open .sidebar{transform:translateX(0)!important} .app-shell .workspace{margin-right:0!important} .app-shell .topbar,.app-shell .topbar.topbar-modern{height:58px!important;padding:0 13px!important;gap:10px!important} .app-shell .menu-button{display:grid!important;place-items:center!important} .app-shell .topbar-quick{display:none!important} .app-shell .page-content{padding:18px 14px 92px!important} .app-shell .topbar-title>b{font-size:.88rem!important}.app-shell .topbar-meta{font-size:.6rem!important} .app-shell .sidebar-close{color:#505862!important;background:#fff!important} .mobile-dock{background:#fff!important;border-top:1px solid var(--hm-line)!important;box-shadow:0 -4px 16px rgba(18,27,38,.04)!important;backdrop-filter:none!important} .mobile-dock a,.mobile-dock button{color:#737b85!important}.mobile-dock a.active{background:var(--hm-subtle-2)!important;color:var(--hm-primary)!important} } @media(max-width:720px){ .crypto-install-row{grid-template-columns:1fr} .app-shell .panel,.app-shell .card,.app-shell .simple-card{padding:16px!important;border-radius:14px!important} .page-hero-minimal{padding:16px!important;flex-direction:column}.hero-badges{justify-content:flex-start} .backup-path-grid{grid-template-columns:1fr}.backup-path-grid>.backup-path-card:last-child{grid-column:auto} .auto-backup-form{grid-template-columns:1fr}.auto-backup-form .switch-row{grid-column:auto} .backup-summary-grid{grid-template-columns:1fr 1fr!important} .preview-metrics{grid-template-columns:1fr 1fr} .app-shell .calendar-overview{padding:14px!important} .app-shell .calendar-day{min-height:102px!important} .app-shell .calendar-week-head,.app-shell .calendar-grid{min-width:680px!important} } @media(max-width:460px){ .app-shell .topbar-actions .small-avatar{display:none!important} .app-shell .topbar-title>b{max-width:190px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .backup-summary-grid{grid-template-columns:1fr!important} .preview-metrics{grid-template-columns:1fr 1fr} } /* ===== hammelk-professional-v5.css ===== */ /* Hammelk Professional UI v5 White-first, high-clarity, responsive admin experience. Loaded after all legacy styles so the interface has one visual language. */ :root{ --hm5-bg:#f8fafc; --hm5-surface:#ffffff; --hm5-surface-soft:#f8fafc; --hm5-surface-blue:#f5f8ff; --hm5-border:#e5eaf0; --hm5-border-strong:#d6dde6; --hm5-text:#172033; --hm5-text-2:#445066; --hm5-muted:#7a8699; --hm5-primary:#3157d5; --hm5-primary-hover:#2948b4; --hm5-primary-soft:#eef2ff; --hm5-primary-ring:rgba(49,87,213,.14); --hm5-danger:#c14747; --hm5-danger-soft:#fff4f4; --hm5-warning:#b27a1b; --hm5-warning-soft:#fff9ed; --hm5-success:#2b7a5a; --hm5-success-soft:#f1faf6; --hm5-blue:#65a9dc; --hm5-blue-soft:#f0f8fd; --hm5-pink:#df89aa; --hm5-pink-soft:#fff2f7; --hm5-violet:#8978d8; --hm5-violet-soft:#f5f3ff; --hm5-occasion:#c59a4d; --hm5-occasion-soft:#fff9ed; --hm5-radius:14px; --hm5-radius-lg:18px; --hm5-shadow-sm:0 1px 2px rgba(20,31,51,.035),0 4px 14px rgba(20,31,51,.035); --hm5-shadow:0 12px 34px rgba(20,31,51,.07); --hm5-sidebar:248px; --primary:var(--hm5-primary)!important; --primary-dark:var(--hm5-primary-hover)!important; --ds-bg:var(--hm5-bg)!important; --ds-surface:#fff!important; --ds-surface-alt:var(--hm5-surface-soft)!important; --ds-border:var(--hm5-border)!important; --ds-text:var(--hm5-text)!important; --ds-muted:var(--hm5-muted)!important; --bg:var(--hm5-bg)!important; --surface:#fff!important; --surface-2:var(--hm5-surface-soft)!important; --text:var(--hm5-text)!important; --muted:var(--hm5-muted)!important; --line:var(--hm5-border)!important; } html{background:var(--hm5-bg)!important;scroll-padding-top:70px!important} body{background:var(--hm5-bg)!important;background-image:none!important;color:var(--hm5-text)!important} body::before,body::after{display:none!important} .app-shell{background:var(--hm5-bg)!important;min-height:100svh} .app-shell .workspace{background:var(--hm5-bg)!important;margin-right:var(--hm5-sidebar)!important;min-width:0!important} .app-shell .page-content{background:var(--hm5-bg)!important;width:100%!important;max-width:1540px!important;margin:0 auto!important;padding:22px clamp(18px,2.35vw,36px) 56px!important} /* ---------------- Sidebar ---------------- */ .app-shell .sidebar{ width:var(--hm5-sidebar)!important;padding:12px 12px 14px!important; background:#fff!important;color:var(--hm5-text)!important; border-left:1px solid var(--hm5-border)!important;box-shadow:none!important; } .app-shell .brand{min-height:50px!important;padding:2px 8px 12px!important;border-bottom:1px solid var(--hm5-border)!important} .app-shell .brand-copy-inline{display:flex!important;align-items:center!important;gap:7px!important;white-space:nowrap!important} .app-shell .brand-copy strong{font-size:1rem!important;color:var(--hm5-text)!important;font-weight:900!important} .app-shell .brand-copy span{color:var(--hm5-muted)!important;font-size:.66rem!important;font-weight:600!important} .app-shell .brand-separator{color:#cbd2dc!important;font-size:.52rem!important} /* Units need to be unmistakably readable. */ .app-shell .sidebar-property.suite-overview{ margin:12px 0 10px!important;padding:12px!important;border:1px solid var(--hm5-border)!important; border-radius:13px!important;background:linear-gradient(180deg,#fff,#fbfcff)!important;box-shadow:none!important; } .app-shell .suite-overview-head{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;margin-bottom:9px!important} .app-shell .suite-overview-head small{color:#5f6c80!important;font-size:.68rem!important;font-weight:900!important;opacity:1!important} .app-shell .property-year{background:#f5f7fa!important;border:1px solid var(--hm5-border)!important;color:#657286!important;border-radius:7px!important;font-size:.64rem!important;font-weight:800!important;padding:3px 7px!important} .app-shell .suite-overview-list{display:grid!important;grid-template-columns:1fr 1fr!important;gap:7px!important} .app-shell .suite-overview-item{ display:flex!important;align-items:center!important;gap:7px!important;min-height:38px!important;padding:7px 8px!important; background:#fff!important;border:1px solid var(--hm5-border)!important;border-radius:10px!important; color:#303b4d!important;opacity:1!important;box-shadow:0 1px 1px rgba(23,32,51,.02)!important; } .app-shell .suite-overview-item b{font-size:.69rem!important;font-weight:900!important;color:#303b4d!important;opacity:1!important;white-space:nowrap!important} .app-shell .suite-color-dot{width:8px!important;height:8px!important;flex:0 0 8px!important;border-radius:50%!important;box-shadow:0 0 0 3px rgba(100,116,139,.06)!important} .app-shell .suite-color-dot.blue{background:var(--hm5-blue)!important}.app-shell .suite-color-dot.pink{background:var(--hm5-pink)!important}.app-shell .suite-color-dot.green{background:#6cb391!important} .app-shell .suite-overview-empty{color:var(--hm5-muted)!important;font-size:.7rem!important} .app-shell .sidebar-nav{padding:4px 0 8px!important;gap:3px!important} .app-shell .organized-menu .menu-section{ min-height:44px!important;margin:0!important;padding:8px 10px!important;border-radius:10px!important; border:1px solid transparent!important;background:#fff!important;color:#465266!important;box-shadow:none!important;transform:none!important; transition:background .15s ease,border-color .15s ease,color .15s ease!important; } .app-shell .organized-menu .menu-section>.icon{width:18px!important;height:18px!important;color:#8490a3!important} .app-shell .organized-menu .menu-section span:not(.menu-open-mark){font-weight:800!important} .app-shell .organized-menu .menu-section:hover{background:#f8fafc!important;border-color:#edf0f4!important;color:var(--hm5-text)!important} .app-shell .organized-menu .menu-section.active{ background:var(--hm5-primary-soft)!important;border-color:#dce4ff!important;color:#2647bd!important; box-shadow:inset -3px 0 var(--hm5-primary)!important; } .app-shell .organized-menu .menu-section.active>.icon{color:var(--hm5-primary)!important} .app-shell .menu-open-mark{margin-right:auto!important;color:#aab3c1!important;font-size:1rem!important} .app-shell .nav-count{background:#eef2ff!important;color:#3157d5!important;border:1px solid #dce4ff!important} .app-shell .sidebar-footer{background:#fff!important;border-top:1px solid var(--hm5-border)!important;padding-top:9px!important} .app-shell .sidebar-account{border-radius:10px!important;color:#374256!important}.app-shell .sidebar-account:hover{background:#f8fafc!important} .app-shell .avatar{background:#f8fafc!important;border:1px solid var(--hm5-border)!important;color:#465266!important;box-shadow:none!important} .app-shell .logout-link{color:#a64b4b!important;border-radius:10px!important}.app-shell .logout-link:hover{background:#fff5f5!important;color:#bd3f3f!important} /* ---------------- Top bar ---------------- */ .app-shell .topbar,.app-shell .topbar.topbar-modern{ position:sticky!important;top:0!important;z-index:45!important;height:62px!important;width:100%!important;margin:0!important; padding:0 clamp(18px,2.35vw,36px)!important;border:0!important;border-bottom:1px solid var(--hm5-border)!important;border-radius:0!important; background:rgba(255,255,255,.96)!important;box-shadow:none!important;backdrop-filter:saturate(140%) blur(12px)!important; display:flex!important;align-items:center!important;gap:12px!important; } .app-shell .topbar-title{display:grid!important;gap:2px!important;min-width:0!important} .app-shell .topbar-title>b{color:var(--hm5-text)!important;font-size:.93rem!important;font-weight:900!important;line-height:1.25!important} .app-shell .topbar-meta{display:flex!important;align-items:center!important;gap:6px!important;color:#8a94a5!important;font-size:.62rem!important} .app-shell .topbar-meta i{width:3px!important;height:3px!important;border-radius:50%!important;background:#c6ced9!important} .app-shell .topbar-actions{margin-right:auto!important;display:flex!important;align-items:center!important;gap:7px!important} .app-shell .topbar-quick,.app-shell .icon-button,.app-shell .notification-bell,.app-shell .small-avatar{ background:#fff!important;border:1px solid var(--hm5-border)!important;color:#596579!important;box-shadow:none!important;border-radius:10px!important; } .app-shell .topbar-quick{min-height:36px!important;padding:0 11px!important;font-size:.69rem!important;font-weight:800!important;text-decoration:none!important} .app-shell .topbar-quick:hover,.app-shell .icon-button:hover,.app-shell .notification-bell:hover{background:#f8fafc!important;color:var(--hm5-text)!important} .app-shell .icon-button,.app-shell .notification-bell,.app-shell .small-avatar{width:36px!important;height:36px!important;min-height:36px!important} .app-shell .notification-count{background:#e14d56!important;color:#fff!important;box-shadow:0 0 0 2px #fff!important} .app-shell .menu-button{display:none!important} /* ---------------- General surfaces ---------------- */ .app-shell .panel,.app-shell .card,.app-shell .ds-card,.app-shell .simple-card, .app-shell .section-hub-card,.app-shell .section-hub-hero,.app-shell .settings-section-card, .app-shell .maintenance-card,.app-shell .bank-card,.app-shell .stat-card,.app-shell .period-card, .app-shell .owner-card,.app-shell .account-card,.app-shell .calendar-settings-hero, .app-shell .dashboard-commandbar,.app-shell .settings-hero,.app-shell .plain-page-head, .app-shell .page-hero-minimal{ background:#fff!important;border:1px solid var(--hm5-border)!important;border-radius:var(--hm5-radius-lg)!important; color:var(--hm5-text)!important;box-shadow:var(--hm5-shadow-sm)!important; } .app-shell .panel,.app-shell .card,.app-shell .simple-card{padding:22px!important} .app-shell h1,.app-shell h2,.app-shell h3,.app-shell h4{color:var(--hm5-text)!important;letter-spacing:-.018em!important} .app-shell p,.app-shell small,.app-shell .helper-text{color:var(--hm5-muted)!important} .app-shell .eyebrow,.app-shell .panel-kicker{color:#66748a!important;font-size:.67rem!important;font-weight:900!important;letter-spacing:0!important} .app-shell .ds-page-header{display:flex!important;align-items:flex-end!important;justify-content:space-between!important;gap:16px!important;margin-bottom:18px!important;padding:0 2px!important} .app-shell .ds-page-header h1{font-size:1.35rem!important;margin:0 0 5px!important}.app-shell .ds-page-header p{margin:0!important;font-size:.77rem!important} .app-shell .panel-head{border-bottom:1px solid #f0f2f5!important;padding-bottom:14px!important;margin-bottom:14px!important} .app-shell .section-hub-hero,.app-shell .settings-hero{padding:25px!important} .app-shell .section-hub-card,.app-shell .settings-section-card{transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease!important} .app-shell .section-hub-card:hover,.app-shell .settings-section-card:hover{transform:translateY(-1px)!important;border-color:#cfd7e3!important;box-shadow:0 10px 30px rgba(20,31,51,.065)!important} .app-shell .section-hub-icon,.app-shell .section-hub-card-icon,.app-shell .settings-section-icon,.app-shell .bank-emblem{ background:#f6f8fb!important;border:1px solid var(--hm5-border)!important;color:#69768a!important;box-shadow:none!important; } /* Dashboard gets restrained personality, not a flat white wall. */ .app-shell .dashboard-commandbar{position:relative!important;overflow:hidden!important;padding:26px!important;border-color:#dde4ef!important;background:linear-gradient(135deg,#ffffff 0%,#f8faff 100%)!important} .app-shell .dashboard-commandbar::before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:var(--hm5-primary)} .app-shell .dashboard-commandbar h2{font-size:1.5rem!important;margin:5px 0!important}.app-shell .dashboard-commandbar p{max-width:760px!important} .app-shell .stat-card{padding:18px!important;min-height:116px!important;box-shadow:none!important} .app-shell .stat-card:hover{border-color:#d4dce8!important} .app-shell .stat-icon{background:#f5f7fb!important;border:1px solid var(--hm5-border)!important;color:#607087!important;box-shadow:none!important} .app-shell .stat-icon.blue{background:#f1f7fd!important;color:#4d88b4!important}.app-shell .stat-icon.amber{background:#fff8eb!important;color:#a87217!important}.app-shell .stat-icon.violet{background:#f5f2ff!important;color:#7462c1!important}.app-shell .stat-icon.teal{background:#f0f9f7!important;color:#4b8b79!important} .app-shell .progress{background:#edf1f5!important}.app-shell .progress i{background:linear-gradient(90deg,#3157d5,#6d88e6)!important} .app-shell .donut{--donut-color:var(--hm5-primary)!important} .app-shell .period-card{box-shadow:none!important}.app-shell .suite-badge{background:#f5f7fb!important;border:1px solid var(--hm5-border)!important;color:#5d697c!important} /* Inputs, buttons, filters */ .app-shell input:not([type=checkbox]):not([type=radio]):not([type=hidden]),.app-shell select,.app-shell textarea{ min-height:44px!important;background:#fff!important;color:#283246!important;border:1px solid var(--hm5-border-strong)!important; border-radius:10px!important;box-shadow:none!important;transition:border-color .14s ease,box-shadow .14s ease!important; } .app-shell input::placeholder,.app-shell textarea::placeholder{color:#a1aab8!important} .app-shell input:focus,.app-shell select:focus,.app-shell textarea:focus{border-color:#8ea3ef!important;box-shadow:0 0 0 3px var(--hm5-primary-ring)!important;outline:none!important} .app-shell label{color:#49556a!important;font-weight:700!important} .app-shell .button,.app-shell button{border-radius:10px!important;box-shadow:none!important;transform:none!important} .app-shell .button.primary,.app-shell button.primary, .app-shell button.button:not(.secondary):not(.ghost-danger):not(.danger):not(.icon-button):not(.modal-close):not(.sidebar-install):not(.text-button):not(.group-toggle):not(.sidebar-close):not(.menu-button):not(.button-secondary):not(.button-danger):not(.owner-result):not(.calendar-panel-close):not(.owner-clear):not(.calendar-nav-button):not(.calendar-day):not(.bank-combobox-toggle):not(.owner-tab):not(#mobileMenuButton):not([data-bank-option]){ background:var(--hm5-primary)!important;color:#fff!important;border-color:var(--hm5-primary)!important; } .app-shell .button.primary:hover,.app-shell button.primary:hover{background:var(--hm5-primary-hover)!important;border-color:var(--hm5-primary-hover)!important} .app-shell .button.secondary,.app-shell button.secondary,.app-shell .button.soft{background:#fff!important;color:#465266!important;border:1px solid var(--hm5-border-strong)!important} .app-shell .button.secondary:hover,.app-shell button.secondary:hover,.app-shell .button.soft:hover{background:#f7f9fc!important;color:var(--hm5-text)!important} .app-shell .button.danger,.app-shell button.danger{background:#fff!important;border:1px solid #efcccc!important;color:var(--hm5-danger)!important} .app-shell .button.danger:hover,.app-shell button.danger:hover{background:var(--hm5-danger-soft)!important} .app-shell .flash{border-radius:11px!important;box-shadow:none!important} .app-shell .flash.success{background:var(--hm5-success-soft)!important;border-color:#d4ebdf!important;color:#2a6c52!important}.app-shell .flash.warning{background:var(--hm5-warning-soft)!important;border-color:#f1dfb9!important;color:#84611d!important}.app-shell .flash.danger{background:var(--hm5-danger-soft)!important;border-color:#efd0d0!important;color:#a64040!important} /* Tables */ .app-shell .table-wrap{border:1px solid var(--hm5-border)!important;border-radius:14px!important;box-shadow:none!important;overflow:hidden!important;background:#fff!important} .app-shell table{background:#fff!important}.app-shell th{background:#f8fafc!important;color:#657185!important;border-color:var(--hm5-border)!important;font-weight:900!important}.app-shell td{background:#fff!important;color:#344054!important;border-color:#edf0f4!important}.app-shell tbody tr:hover td{background:#fafbfe!important} /* ---------------- Professional calendar ---------------- */ .app-shell .professional-calendar{display:grid!important;gap:14px!important} .app-shell .calendar-command-center{ background:#fff!important;border:1px solid var(--hm5-border)!important;border-radius:16px!important;box-shadow:var(--hm5-shadow-sm)!important;overflow:hidden!important; } .app-shell .calendar-command-top{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:24px!important;padding:18px 20px 15px!important} .app-shell .calendar-command-heading{min-width:0!important}.app-shell .calendar-command-heading .eyebrow{display:block!important;margin-bottom:3px!important} .app-shell .calendar-title-row{display:flex!important;align-items:center!important;gap:9px!important;flex-wrap:wrap!important}.app-shell .calendar-title-row h1{margin:0!important;font-size:1.35rem!important;font-weight:950!important} .app-shell .calendar-command-heading p{margin:5px 0 0!important;font-size:.73rem!important;line-height:1.8!important} .app-shell .calendar-command-actions{display:flex!important;align-items:center!important;gap:9px!important;flex-wrap:wrap!important;justify-content:flex-end!important} .app-shell .calendar-month-nav{display:flex!important;direction:ltr!important;align-items:center!important;gap:5px!important;padding:4px!important;background:#f7f9fc!important;border:1px solid var(--hm5-border)!important;border-radius:11px!important} .app-shell .calendar-nav-button{display:grid!important;place-items:center!important;width:31px!important;height:31px!important;min-height:31px!important;border:0!important;border-radius:8px!important;background:transparent!important;color:#5e6a7e!important;text-decoration:none!important;font-size:1.1rem!important;font-weight:900!important} .app-shell .calendar-nav-button:hover{background:#fff!important;color:var(--hm5-primary)!important;box-shadow:0 1px 2px rgba(20,31,51,.06)!important} .app-shell .calendar-today{display:grid!important;place-items:center!important;min-width:52px!important;height:31px!important;padding:0 10px!important;border-radius:8px!important;background:#fff!important;color:#465266!important;border:1px solid #e7ebf0!important;text-decoration:none!important;font-size:.68rem!important;font-weight:900!important} .app-shell .calendar-create-actions{display:flex!important;gap:7px!important}.app-shell .calendar-create-actions .compact{min-height:40px!important;padding:0 13px!important;font-size:.71rem!important} .app-shell .calendar-cache-status{display:inline-flex!important;align-items:center!important;gap:5px!important;min-height:26px!important;padding:0 8px!important;border-radius:999px!important;background:#f7f9fc!important;border:1px solid var(--hm5-border)!important;color:#667389!important;font-size:.62rem!important;font-weight:800!important} .app-shell .calendar-cache-status i{width:6px!important;height:6px!important;border-radius:50%!important;background:#9aa5b5!important}.app-shell .calendar-cache-status.ready i{background:#55a17e!important}.app-shell .calendar-cache-status.syncing i{background:#d19a33!important} .app-shell .calendar-command-bar{display:flex!important;align-items:center!important;gap:14px!important;padding:10px 16px!important;background:#fafbfc!important;border-top:1px solid #edf0f4!important;border-bottom:1px solid #edf0f4!important} .app-shell .calendar-view-tabs{display:flex!important;align-items:center!important;gap:3px!important;padding:3px!important;background:#f1f4f7!important;border:1px solid #e6eaf0!important;border-radius:10px!important;box-shadow:none!important} .app-shell .calendar-view-tabs a{min-width:52px!important;padding:7px 10px!important;border-radius:7px!important;text-decoration:none!important;color:#6f7b8e!important;font-size:.67rem!important;font-weight:900!important;text-align:center!important;border:0!important;background:transparent!important} .app-shell .calendar-view-tabs a:hover{color:#344054!important}.app-shell .calendar-view-tabs a.active{background:#fff!important;color:var(--hm5-primary)!important;box-shadow:0 1px 4px rgba(20,31,51,.08)!important} .app-shell .calendar-mini-stats{display:flex!important;align-items:center!important;gap:12px!important;margin-right:auto!important} .app-shell .calendar-mini-stats>span{display:flex!important;align-items:center!important;gap:5px!important;color:#6b778a!important;font-size:.64rem!important}.app-shell .calendar-mini-stats i{width:7px!important;height:7px!important;border-radius:50%!important}.app-shell .calendar-mini-stats i.occasion{background:var(--hm5-occasion)!important}.app-shell .calendar-mini-stats i.period{background:var(--hm5-blue)!important}.app-shell .calendar-mini-stats i.event{background:var(--hm5-violet)!important}.app-shell .calendar-mini-stats b{color:#344054!important;font-size:.72rem!important}.app-shell .calendar-mini-stats small{font-size:.61rem!important;color:#8994a5!important} .app-shell .calendar-settings-link{color:#5d697d!important;text-decoration:none!important;font-size:.67rem!important;font-weight:900!important;padding:7px 9px!important;border-radius:8px!important}.app-shell .calendar-settings-link:hover{background:#eef2ff!important;color:var(--hm5-primary)!important} .app-shell .calendar-filter-panel{background:#fff!important}.app-shell .calendar-filter-panel summary{display:none!important}.app-shell .calendar-filters{display:grid!important;grid-template-columns:repeat(4,minmax(120px,1fr)) auto minmax(280px,1.6fr)!important;gap:8px!important;padding:12px 16px!important;align-items:end!important} .app-shell .calendar-filters>label{display:grid!important;gap:5px!important}.app-shell .calendar-filters>label>span:first-child{font-size:.61rem!important;color:#7a8698!important;font-weight:900!important}.app-shell .calendar-filters select{min-height:37px!important;height:37px!important;padding-top:0!important;padding-bottom:0!important;font-size:.67rem!important;border-radius:9px!important} .app-shell .calendar-filters .filter-check{display:flex!important;align-items:center!important;gap:6px!important;min-height:37px!important;padding:0 10px!important;border:1px solid var(--hm5-border)!important;border-radius:9px!important;background:#fff!important;white-space:nowrap!important}.app-shell .calendar-filters .filter-check input{width:15px!important;height:15px!important;min-height:15px!important}.app-shell .calendar-filters .filter-check span{font-size:.65rem!important;color:#566277!important} .app-shell .calendar-layer-checks{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:5px!important;min-height:37px!important}.app-shell .calendar-layer-checks label{display:flex!important;align-items:center!important;gap:5px!important;padding:7px 8px!important;border:1px solid var(--hm5-border)!important;border-radius:9px!important;background:#fff!important;color:#596579!important;font-size:.64rem!important;font-weight:800!important;white-space:nowrap!important}.app-shell .calendar-layer-checks input[type=checkbox]{width:14px!important;height:14px!important;min-height:14px!important}.app-shell .legend-dot{width:6px!important;height:6px!important;border-radius:50%!important}.app-shell .legend-dot.occasion{background:var(--hm5-occasion)!important}.app-shell .legend-dot.period{background:var(--hm5-blue)!important}.app-shell .legend-dot.event{background:var(--hm5-violet)!important} /* Calendar board: connected white grid, clear hierarchy. */ .app-shell .calendar-board{background:#fff!important;border:1px solid var(--hm5-border)!important;border-radius:16px!important;box-shadow:var(--hm5-shadow-sm)!important;overflow:hidden!important} .app-shell .calendar-week-head{display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr))!important;background:#f7f9fc!important;border:0!important;border-bottom:1px solid var(--hm5-border)!important;color:#667388!important;min-width:0!important} .app-shell .calendar-week-head>span{padding:10px 8px!important;text-align:center!important;font-size:.65rem!important;font-weight:900!important;border-left:1px solid #edf0f4!important}.app-shell .calendar-week-head>span:last-child{border-left:0!important}.app-shell .calendar-week-head .friday{color:#b35a5a!important;background:#fff8f8!important} .app-shell .calendar-grid{display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr))!important;gap:0!important;background:#fff!important;border:0!important;min-width:0!important} .app-shell .calendar-day{ appearance:none!important;position:relative!important;min-height:124px!important;padding:9px!important;text-align:right!important;cursor:pointer!important; background:#fff!important;color:#344054!important;border:0!important;border-left:1px solid #edf0f4!important;border-bottom:1px solid #edf0f4!important;border-radius:0!important;box-shadow:none!important;font:inherit!important;overflow:hidden!important; } .app-shell .calendar-day:nth-child(7n){border-left:0!important}.app-shell .calendar-day:hover{background:#fbfcff!important;box-shadow:inset 0 0 0 1px #dfe5ef!important;z-index:1!important}.app-shell .calendar-day.empty{background:#fafbfc!important;cursor:default!important}.app-shell .calendar-day.holiday{background:#fffdfd!important}.app-shell .calendar-day.today{background:#f8faff!important;box-shadow:inset 0 0 0 2px #8da3ef!important;z-index:2!important}.app-shell .calendar-day.today:hover{background:#f5f7ff!important} .app-shell .calendar-day-top{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:6px!important;min-height:27px!important}.app-shell .calendar-day-number{display:grid!important;place-items:center!important;width:28px!important;height:28px!important;border-radius:9px!important;color:#475467!important;background:transparent!important;font-size:.76rem!important;font-weight:950!important}.app-shell .calendar-day.today .calendar-day-number{background:var(--hm5-primary)!important;color:#fff!important}.app-shell .calendar-day.holiday:not(.today) .calendar-day-number{color:#b44e4e!important} .app-shell .holiday-mark{position:static!important;display:inline-flex!important;align-items:center!important;min-height:20px!important;padding:0 6px!important;border-radius:999px!important;background:#fff3f3!important;border:1px solid #f3dede!important;color:#b15b5b!important;font-size:.53rem!important;font-weight:900!important} .app-shell .calendar-day-items{display:grid!important;gap:4px!important;margin-top:7px!important}.app-shell .day-item{display:flex!important;align-items:center!important;gap:5px!important;min-width:0!important;padding:4px 6px!important;border:1px solid transparent!important;border-radius:7px!important;background:#f8fafc!important;color:#5b6679!important;font-size:.59rem!important;line-height:1.5!important;box-shadow:none!important}.app-shell .day-item>i{width:6px!important;height:6px!important;flex:0 0 6px!important;border-radius:50%!important;background:#9aa5b5!important}.app-shell .day-item>span{overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;min-width:0!important}.app-shell .day-item b{font-size:inherit!important;color:inherit!important}.app-shell .day-item.occasion{background:var(--hm5-occasion-soft)!important;border-color:#f3e6c9!important;color:#80652f!important}.app-shell .day-item.occasion i{background:var(--hm5-occasion)!important}.app-shell .day-item.occasion.holiday-item{background:#fff4f4!important;border-color:#f3dede!important;color:#a85454!important}.app-shell .day-item.occasion.holiday-item i{background:#d66d6d!important}.app-shell .day-item.period{background:#f7f9fc!important;border-color:#e7ebf0!important;color:#59677a!important}.app-shell .day-item.period.blue{background:var(--hm5-blue-soft)!important;border-color:#dbeef9!important;color:#4f7893!important}.app-shell .day-item.period.blue i{background:var(--hm5-blue)!important}.app-shell .day-item.period.pink{background:var(--hm5-pink-soft)!important;border-color:#f5dce6!important;color:#8d5d72!important}.app-shell .day-item.period.pink i{background:var(--hm5-pink)!important}.app-shell .day-item.event{background:var(--hm5-violet-soft)!important;border-color:#e8e3fb!important;color:#685c99!important}.app-shell .day-item.event i{background:var(--hm5-violet)!important}.app-shell .day-more{display:inline-flex!important;width:max-content!important;margin-top:1px!important;padding:2px 5px!important;color:#8b96a7!important;font-size:.54rem!important;font-weight:800!important} /* Agenda */ .app-shell .calendar-agenda-card{background:#fff!important;border:1px solid var(--hm5-border)!important;border-radius:16px!important;box-shadow:var(--hm5-shadow-sm)!important;padding:18px!important}.app-shell .agenda-day{border-color:#edf0f4!important;border-radius:12px!important;background:#fff!important}.app-shell .agenda-day:hover{background:#fbfcff!important}.app-shell .agenda-day.holiday{border-right:3px solid #e58c8c!important}.app-shell .agenda-date{background:#f8fafc!important;border-color:var(--hm5-border)!important}.app-shell .agenda-item{background:#fff!important;border-color:#edf0f4!important} /* Calendar drawers / workflows */ .app-shell .calendar-overlay{background:rgba(21,29,43,.34)!important;backdrop-filter:blur(3px)!important}.app-shell .calendar-drawer,.app-shell .calendar-workflow-drawer,.app-shell .calendar-day-panel,.app-shell .calendar-form-modal{background:#fff!important;border-color:var(--hm5-border)!important;box-shadow:-20px 0 55px rgba(20,31,51,.13)!important}.app-shell .calendar-drawer-head,.app-shell .workflow-drawer-head{border-bottom:1px solid #edf0f4!important;background:#fff!important}.app-shell .calendar-panel-close{background:#f7f9fc!important;border:1px solid var(--hm5-border)!important;color:#647084!important}.app-shell .calendar-panel-close:hover{background:#eef2ff!important;color:var(--hm5-primary)!important}.app-shell .day-panel-summary span{background:#f8fafc!important;border-color:var(--hm5-border)!important}.app-shell .panel-section,.app-shell .workflow-step,.app-shell .period-form-section{background:#fff!important;border-color:var(--hm5-border)!important;box-shadow:none!important}.app-shell .workflow-step-title>span{background:#eef2ff!important;color:var(--hm5-primary)!important;border-color:#dce4ff!important}.app-shell .suite-choice{background:#fff!important;border-color:var(--hm5-border)!important;color:#465266!important}.app-shell .suite-choice:hover{border-color:#cbd4e2!important;background:#fbfcff!important}.app-shell .suite-choice:has(input:checked){background:#f8faff!important;border-color:#9eb0ef!important;box-shadow:0 0 0 3px var(--hm5-primary-ring)!important}.app-shell .suite-choice.blue:has(input:checked){background:var(--hm5-blue-soft)!important;border-color:#add4ec!important}.app-shell .suite-choice.pink:has(input:checked){background:var(--hm5-pink-soft)!important;border-color:#e9b6ca!important}.app-shell .owner-picker-results{border-color:var(--hm5-border)!important;box-shadow:0 14px 35px rgba(20,31,51,.12)!important}.app-shell .owner-result:hover{background:#f7f9fc!important}.app-shell .selected-date-chip{background:#f5f7fb!important;border-color:var(--hm5-border)!important;color:#596579!important} /* Settings / section pages */ .app-shell .settings-jump-nav{background:#fff!important;border:1px solid var(--hm5-border)!important;border-radius:13px!important;box-shadow:none!important}.app-shell .settings-jump-nav a{color:#5b677a!important;border-radius:9px!important}.app-shell .settings-jump-nav a:hover{background:#f7f9fc!important;color:var(--hm5-primary)!important}.app-shell .settings-section-card{box-shadow:none!important}.app-shell .design-setting-box,.app-shell .design-preview,.app-shell .settings-subsection{background:#f9fafc!important;border-color:var(--hm5-border)!important}.app-shell .maintenance-card{box-shadow:none!important} .app-shell .section-hub-grid{gap:14px!important}.app-shell .section-hub-card{min-height:140px!important}.app-shell .section-hub-card h3{font-size:.95rem!important}.app-shell .section-hub-card p{font-size:.7rem!important;line-height:1.85!important} /* Stays and ordinary forms */ .app-shell .form-grid{gap:13px!important}.app-shell .rate-summary{background:#f8faff!important;border:1px solid #e1e6f6!important;border-radius:13px!important;color:#465266!important}.app-shell .rate-summary b{color:#344054!important}.app-shell .actions{padding-top:4px!important} /* Backup stays visually integrated with v5. */ .app-shell .backup-page .panel,.app-shell .backup-path-card{box-shadow:none!important}.app-shell .security-badge{background:#f8faff!important;border-color:#dce4ff!important;color:var(--hm5-primary)!important}.app-shell .success-badge,.app-shell .status-pill.ok{background:var(--hm5-success-soft)!important;border-color:#d4ebdf!important;color:#2f735a!important}.app-shell .warning-badge{background:var(--hm5-warning-soft)!important;border-color:#f1dfb9!important;color:#84611d!important} /* ---------------- Responsive ---------------- */ @media(max-width:1180px){ :root{--hm5-sidebar:226px} .app-shell .calendar-filters{grid-template-columns:repeat(4,minmax(105px,1fr))!important}.app-shell .calendar-layer-checks{grid-column:1/-1!important;justify-content:flex-start!important} } @media(max-width:900px){ .app-shell .sidebar{width:min(318px,88vw)!important;transform:translateX(110%)!important;z-index:80!important;box-shadow:-18px 0 45px rgba(20,31,51,.14)!important} .sidebar-open .sidebar{transform:translateX(0)!important}.app-shell .workspace{margin-right:0!important}.app-shell .topbar,.app-shell .topbar.topbar-modern{height:58px!important;padding:0 14px!important}.app-shell .menu-button{display:grid!important;place-items:center!important}.app-shell .topbar-quick{display:none!important}.app-shell .page-content{padding:16px 12px 88px!important}.app-shell .suite-overview-item b{font-size:.72rem!important} .app-shell .mobile-dock,.mobile-dock{background:rgba(255,255,255,.97)!important;border-top:1px solid var(--hm5-border)!important;box-shadow:0 -6px 20px rgba(20,31,51,.06)!important;backdrop-filter:blur(10px)!important}.mobile-dock a,.mobile-dock button{color:#7a8698!important}.mobile-dock a.active{background:#eef2ff!important;color:var(--hm5-primary)!important} .app-shell .calendar-command-top{align-items:flex-start!important;flex-direction:column!important;gap:13px!important;padding:15px!important}.app-shell .calendar-command-actions{width:100%!important;justify-content:space-between!important}.app-shell .calendar-command-bar{flex-wrap:wrap!important;padding:9px 12px!important}.app-shell .calendar-view-tabs{order:1!important;flex:1!important}.app-shell .calendar-view-tabs a{flex:1!important;min-width:0!important}.app-shell .calendar-mini-stats{order:2!important;margin-right:0!important}.app-shell .calendar-settings-link{order:3!important;margin-right:auto!important} .app-shell .calendar-filter-panel summary{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;padding:11px 13px!important;cursor:pointer!important;color:#465266!important;font-size:.7rem!important;font-weight:900!important;border-top:1px solid #edf0f4!important}.app-shell .calendar-filter-panel summary small{font-size:.58rem!important;color:#8b96a7!important;font-weight:700!important}.app-shell .calendar-filter-panel[open] summary{background:#fafbfc!important}.app-shell .calendar-filters{grid-template-columns:1fr 1fr!important;padding:12px!important}.app-shell .calendar-layer-checks{grid-column:1/-1!important;justify-content:flex-start!important;flex-wrap:wrap!important}.app-shell .calendar-filters .filter-check{grid-column:1/-1!important} } @media(max-width:640px){ .app-shell .topbar-title>b{font-size:.86rem!important}.app-shell .topbar-meta{font-size:.58rem!important}.app-shell .topbar-actions .small-avatar{display:none!important} .app-shell .panel,.app-shell .card,.app-shell .simple-card{padding:16px!important;border-radius:14px!important}.app-shell .dashboard-commandbar{padding:18px!important}.app-shell .dashboard-commandbar h2{font-size:1.2rem!important}.app-shell .stat-grid{grid-template-columns:1fr 1fr!important;gap:9px!important}.app-shell .stat-card{padding:13px!important;min-height:100px!important}.app-shell .stat-card strong{font-size:1.05rem!important} .app-shell .calendar-command-heading p{display:none!important}.app-shell .calendar-title-row h1{font-size:1.14rem!important}.app-shell .calendar-command-actions{align-items:center!important}.app-shell .calendar-create-actions .secondary{display:none!important}.app-shell .calendar-mini-stats{width:100%!important;justify-content:space-between!important;order:3!important}.app-shell .calendar-mini-stats>span{flex:1!important;justify-content:center!important;padding:3px!important}.app-shell .calendar-settings-link{display:none!important} .app-shell .calendar-filters{grid-template-columns:1fr 1fr!important}.app-shell .calendar-filters>label:nth-of-type(3),.app-shell .calendar-filters>label:nth-of-type(4){grid-column:span 1!important} /* Mobile month keeps seven columns, but shows compact event dots instead of text. */ .app-shell .calendar-board{border-radius:13px!important;overflow:hidden!important}.app-shell .calendar-week-head,.app-shell .calendar-grid{min-width:0!important;width:100%!important}.app-shell .calendar-week-head>span{padding:8px 2px!important;font-size:.54rem!important;white-space:nowrap!important}.app-shell .calendar-day{min-height:72px!important;padding:5px!important;border-radius:0!important}.app-shell .calendar-day-number{width:24px!important;height:24px!important;font-size:.67rem!important;border-radius:8px!important}.app-shell .holiday-mark{font-size:0!important;width:6px!important;height:6px!important;min-height:6px!important;padding:0!important;border:0!important;background:#dc6c6c!important}.app-shell .calendar-day-items{display:flex!important;align-items:center!important;gap:3px!important;flex-wrap:wrap!important;margin-top:5px!important}.app-shell .day-item{width:8px!important;height:8px!important;min-height:8px!important;padding:0!important;border:0!important;border-radius:50%!important;background:#9aa5b5!important;overflow:hidden!important}.app-shell .day-item>i,.app-shell .day-item>span{display:none!important}.app-shell .day-item.occasion{background:var(--hm5-occasion)!important}.app-shell .day-item.occasion.holiday-item{background:#d66d6d!important}.app-shell .day-item.period{background:#94a0b2!important}.app-shell .day-item.period.blue{background:var(--hm5-blue)!important}.app-shell .day-item.period.pink{background:var(--hm5-pink)!important}.app-shell .day-item.event{background:var(--hm5-violet)!important}.app-shell .day-more{display:none!important} .app-shell .calendar-overlay.calendar-drawer-overlay{align-items:flex-end!important;justify-content:stretch!important}.app-shell .calendar-drawer,.app-shell .calendar-workflow-drawer{width:100%!important;height:auto!important;max-height:92svh!important;border-radius:18px 18px 0 0!important;border-right:0!important;border-top:1px solid var(--hm5-border)!important;box-shadow:0 -18px 50px rgba(20,31,51,.14)!important} .app-shell .calendar-panel-actions,.app-shell .period-modal-actions,.app-shell .calendar-event-form .modal-actions{position:sticky!important;bottom:0!important;background:#fff!important;border-top:1px solid #edf0f4!important;padding:10px 14px calc(10px + env(safe-area-inset-bottom))!important;z-index:3!important} .app-shell .mobile-cards table,.app-shell .mobile-cards tbody,.app-shell .mobile-cards tr,.app-shell .mobile-cards td{display:block!important;width:100%!important}.app-shell .mobile-cards thead{display:none!important}.app-shell .mobile-cards tr{margin-bottom:10px!important;padding:12px!important;border:1px solid var(--hm5-border)!important;border-radius:12px!important;background:#fff!important}.app-shell .mobile-cards td{display:flex!important;justify-content:space-between!important;gap:12px!important;padding:7px 0!important;border:0!important;border-bottom:1px dashed #edf0f4!important}.app-shell .mobile-cards td:last-child{border-bottom:0!important}.app-shell .mobile-cards td::before{content:attr(data-label);color:#8792a3;font-size:.64rem;font-weight:800!important} } @media(max-width:430px){ .app-shell .suite-overview-list{grid-template-columns:1fr 1fr!important}.app-shell .topbar-title>b{max-width:180px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}.app-shell .calendar-view-tabs a{padding:7px 4px!important;font-size:.61rem!important}.app-shell .calendar-filters{grid-template-columns:1fr!important}.app-shell .calendar-filters>label,.app-shell .calendar-filters .filter-check{grid-column:1!important}.app-shell .calendar-layer-checks{grid-column:1!important}.app-shell .calendar-day{min-height:66px!important}.app-shell .calendar-week-head>span{font-size:.49rem!important}.app-shell .stat-grid{grid-template-columns:1fr!important} } /* Specificity guard: legacy global button rules used many :not() selectors and could repaint calendar cells. The ID-scoped rules below deliberately outrank those legacy selectors. */ #main-content .professional-calendar .calendar-grid button.calendar-day{background:#fff!important;color:#344054!important;border-left:1px solid #edf0f4!important;border-bottom:1px solid #edf0f4!important} #main-content .professional-calendar .calendar-grid button.calendar-day:hover{background:#fbfcff!important;color:#344054!important} #main-content .professional-calendar .calendar-grid button.calendar-day.holiday{background:#fffdfd!important} #main-content .professional-calendar .calendar-grid button.calendar-day.today{background:#f8faff!important;color:#344054!important} #main-content .professional-calendar .calendar-grid button.calendar-day.empty{background:#fafbfc!important} /* v5.2 — calendar assignment workflow hardening */ .app-shell .calendar-workflow-drawer{ display:flex!important; flex-direction:column!important; overflow:hidden!important; } .app-shell .calendar-workflow-drawer .workflow-drawer-head{ flex:0 0 auto!important; } .app-shell .calendar-workflow-drawer .calendar-period-form, .app-shell .calendar-workflow-drawer .calendar-event-form{ flex:1 1 auto!important; min-height:0!important; overflow-y:auto!important; overscroll-behavior:contain!important; scrollbar-gutter:stable!important; } .app-shell .calendar-period-form .workflow-step{ padding:16px 2px!important; } .app-shell .calendar-period-form .workflow-step:first-of-type{padding-top:8px!important} .app-shell .owner-smart-picker{position:relative!important;display:grid!important;gap:8px!important} .app-shell .owner-search-control{position:relative!important} .app-shell .owner-search-control>input{padding-left:86px!important;background:#fff!important} .app-shell .owner-picker-hint{display:block!important;color:#8a94a6!important;font-size:9.5px!important;line-height:1.7!important;padding:0 2px!important} .app-shell .owner-selected-summary{display:grid!important;grid-template-columns:auto 1fr auto!important;align-items:center!important;gap:8px!important;padding:9px 11px!important;border:1px solid #dfe5ef!important;border-radius:10px!important;background:#f8faff!important;color:#344054!important} .app-shell .owner-selected-summary[hidden]{display:none!important} .app-shell .owner-selected-summary span{font-size:9px!important;color:#7a8699!important} .app-shell .owner-selected-summary b{font-size:11px!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important} .app-shell .owner-selected-summary small{font-size:9px!important;color:#51637f!important;background:#eef2ff!important;border-radius:999px!important;padding:3px 7px!important} /* Stronger than the legacy global `button:not(...)` rule in style.css. */ #periodOwnerResults.owner-picker-results{ position:relative!important; top:auto!important; right:auto!important; left:auto!important; z-index:2!important; max-height:none!important; overflow:visible!important; padding:5px!important; border:1px solid #dfe5ef!important; border-radius:12px!important; background:#fff!important; box-shadow:0 10px 28px rgba(20,31,51,.09)!important; } #periodOwnerResults.owner-picker-results[hidden]{display:none!important} #periodOwnerResults.owner-picker-results > button.owner-result:not(.secondary):not(.ghost-danger){ width:100%!important; min-height:44px!important; display:flex!important; align-items:center!important; justify-content:space-between!important; gap:12px!important; margin:0!important; padding:8px 10px!important; border:0!important; border-bottom:1px solid #eef1f5!important; border-radius:8px!important; background:#fff!important; color:#263244!important; box-shadow:none!important; text-align:right!important; transform:none!important; } #periodOwnerResults.owner-picker-results > button.owner-result:last-of-type{border-bottom-color:transparent!important} #periodOwnerResults.owner-picker-results > button.owner-result:not(.secondary):not(.ghost-danger):hover, #periodOwnerResults.owner-picker-results > button.owner-result:not(.secondary):not(.ghost-danger):focus-visible{ background:#f6f8fc!important; color:#1f2a3b!important; outline:none!important; } #periodOwnerResults .owner-result-main{display:grid!important;gap:2px!important;min-width:0!important} #periodOwnerResults .owner-result-main b{font-size:11px!important;color:#263244!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important} #periodOwnerResults .owner-result-main small{font-size:8.8px!important;color:#8b96a8!important} #periodOwnerResults .owner-result em{font-style:normal!important;font-size:9px!important;font-weight:800!important;color:#51637f!important;background:#f2f5fa!important;border-radius:999px!important;padding:4px 7px!important;white-space:nowrap!important} #periodOwnerResults .owner-result.free em{background:#f3f4f6!important;color:#667085!important} #periodOwnerResults .owner-result-empty,#periodOwnerResults .owner-result-more{padding:9px 10px!important;color:#7a8698!important;font-size:9.5px!important;line-height:1.7!important;text-align:center!important} #periodOwnerResults .owner-result-more{border-top:1px dashed #e6eaf0!important;background:#fafbfc!important;border-radius:7px!important} @media(max-width:720px){ .app-shell .calendar-workflow-drawer{max-height:94svh!important} .app-shell .calendar-workflow-drawer .calendar-period-form{padding:10px 14px 0!important} .app-shell .calendar-period-form .workflow-step{padding:13px 0!important} .app-shell .workflow-step-title{margin-bottom:9px!important} .app-shell .owner-picker-hint{font-size:9px!important} #periodOwnerResults.owner-picker-results > button.owner-result:not(.secondary):not(.ghost-danger){min-height:42px!important} } /* ===== hammelk-premium-v6.css ===== */ /* Hammelk Premium UI v6 — calm, product-grade white interface */ :root{ --hm6-bg:#ffffff; --hm6-surface:#ffffff; --hm6-soft:#f7f9fc; --hm6-soft-2:#f2f5f9; --hm6-border:#e3e8ef; --hm6-border-strong:#d3dae5; --hm6-text:#172033; --hm6-muted:#697386; --hm6-faint:#98a2b3; --hm6-primary:#3f5fd3; --hm6-primary-dark:#304ebd; --hm6-primary-soft:#eef2ff; --hm6-success:#16815f; --hm6-success-soft:#ecf8f3; --hm6-danger:#c64545; --hm6-danger-soft:#fff2f2; --hm6-warning:#a96d16; --hm6-blue:#64a9d5; --hm6-pink:#de89aa; --hm6-shadow:0 8px 28px rgba(23,32,51,.055); --hm6-shadow-lg:0 24px 80px rgba(23,32,51,.16); } html,body{background:var(--hm6-bg)!important;color:var(--hm6-text)!important} body{font-feature-settings:"ss01" 1,"tnum" 1} .app-shell{background:#fff!important} .app-shell .workspace{background:#fff!important} .app-shell .content{background:#fff!important;padding:22px 28px 40px!important} .app-shell .sidebar{background:#fff!important;border-left:1px solid var(--hm6-border)!important;box-shadow:none!important} .app-shell .brand{border-bottom:1px solid #eef1f5!important;padding:18px 20px!important} .app-shell .brand-copy strong{color:#1c2740!important;font-size:1rem!important;font-weight:900!important;letter-spacing:-.02em} .app-shell .brand-copy span{color:#7c8798!important} .app-shell .sidebar-property.suite-overview{background:#fff!important;border:1px solid var(--hm6-border)!important;box-shadow:none!important;margin:14px 16px!important;padding:14px!important;border-radius:15px!important} .app-shell .suite-overview-head small{color:#566176!important;font-weight:900!important;font-size:.72rem!important} .app-shell .property-year{background:#f3f5f8!important;color:#48556b!important;border:1px solid #e4e8ef!important} .app-shell .suite-overview-item{background:#fafbfc!important;border:1px solid #e6eaf0!important;color:#29354a!important;opacity:1!important} .app-shell .suite-overview-item b{color:#29354a!important;font-weight:900!important;opacity:1!important} .app-shell .suite-color-dot.blue{background:var(--hm6-blue)!important}.app-shell .suite-color-dot.pink{background:var(--hm6-pink)!important} .app-shell .sidebar-nav{padding:4px 12px 14px!important} .app-shell .menu-section{border:1px solid transparent!important;background:#fff!important;color:#4e5a6e!important;border-radius:11px!important;min-height:48px!important;margin:3px 0!important;font-weight:800!important} .app-shell .menu-section:hover{background:#f7f9fc!important;color:#24324a!important} .app-shell .menu-section.active{background:var(--hm6-primary-soft)!important;color:#2f4fbd!important;border-color:#dfe5ff!important;box-shadow:none!important} .app-shell .menu-section.active::after{content:"";position:absolute;right:0;width:3px;height:24px;border-radius:3px;background:var(--hm6-primary)!important} .app-shell .menu-section .icon{color:#8792a5!important}.app-shell .menu-section.active .icon{color:var(--hm6-primary)!important} .app-shell .sidebar-footer{border-top:1px solid #eef1f5!important;background:#fff!important} .app-shell .topbar{height:58px!important;min-height:58px!important;background:rgba(255,255,255,.96)!important;border-bottom:1px solid var(--hm6-border)!important;box-shadow:none!important;padding:0 22px!important;backdrop-filter:saturate(140%) blur(10px)} .app-shell .topbar-title>b{color:#1d293d!important;font-size:.95rem!important;font-weight:900!important}.app-shell .topbar-meta{color:#8a95a6!important} .app-shell .icon-button{background:#fff!important;color:#445169!important;border:1px solid var(--hm6-border)!important;box-shadow:none!important} .app-shell .icon-button:hover{background:#f7f9fc!important;border-color:#d5dce6!important} .app-shell .panel,.app-shell .card,.app-shell .simple-card,.app-shell .section-hero,.app-shell .section-card{background:#fff!important;border:1px solid var(--hm6-border)!important;box-shadow:var(--hm6-shadow)!important} .app-shell input,.app-shell select,.app-shell textarea{background:#fff!important;border-color:#dce2eb!important;color:#202b3e!important;box-shadow:none!important} .app-shell input:focus,.app-shell select:focus,.app-shell textarea:focus{border-color:#8da1eb!important;box-shadow:0 0 0 3px rgba(63,95,211,.09)!important} .app-shell .button,.app-shell button.button{background:var(--hm6-primary)!important;border-color:var(--hm6-primary)!important;color:#fff!important;box-shadow:none!important} .app-shell .button:hover,.app-shell button.button:hover{background:var(--hm6-primary-dark)!important;border-color:var(--hm6-primary-dark)!important;transform:none!important} .app-shell .button.secondary,.app-shell button.button.secondary{background:#fff!important;border-color:#dce2eb!important;color:#3f4b60!important} .app-shell .button.secondary:hover{background:#f7f9fc!important;color:#29364b!important} /* Calendar: professional white board, no full-cell color flood */ #main-content .professional-calendar{--cal-accent:var(--hm6-primary)} #main-content .professional-calendar .calendar-command-center{background:#fff!important;border:1px solid var(--hm6-border)!important;border-radius:16px!important;box-shadow:var(--hm6-shadow)!important} #main-content .professional-calendar .calendar-title-row h1{color:#182337!important;letter-spacing:-.02em} #main-content .professional-calendar .calendar-command-heading p{color:#7c8799!important} #main-content .professional-calendar .calendar-view-tabs{background:#f4f6fa!important;border:1px solid #e7ebf1!important} #main-content .professional-calendar .calendar-view-tabs a{color:#697488!important} #main-content .professional-calendar .calendar-view-tabs a.active{background:#fff!important;color:#324fbd!important;box-shadow:0 1px 4px rgba(32,47,73,.08)!important} #main-content .professional-calendar .calendar-board{background:#fff!important;border:1px solid var(--hm6-border)!important;border-radius:16px!important;overflow:hidden!important;box-shadow:var(--hm6-shadow)!important} #main-content .professional-calendar .calendar-week-head{background:#f8fafc!important;border-bottom:1px solid var(--hm6-border)!important} #main-content .professional-calendar .calendar-week-head>span{color:#7b8698!important;font-weight:900!important;padding:11px 8px!important} #main-content .professional-calendar .calendar-grid{gap:0!important;background:#fff!important} #main-content .professional-calendar .calendar-grid button.calendar-day{min-height:122px!important;border:0!important;border-left:1px solid #edf0f4!important;border-bottom:1px solid #edf0f4!important;border-radius:0!important;background:#fff!important;color:#263247!important;padding:10px!important;box-shadow:none!important} #main-content .professional-calendar .calendar-grid button.calendar-day:hover{background:#fafbfe!important;box-shadow:inset 0 0 0 1px #dde4f5!important;z-index:1!important} #main-content .professional-calendar .calendar-grid button.calendar-day.today{background:#f8faff!important;box-shadow:inset 0 0 0 2px rgba(63,95,211,.35)!important} #main-content .professional-calendar .calendar-grid button.calendar-day.holiday{background:#fffafa!important} #main-content .professional-calendar .calendar-day-number{background:transparent!important;color:#334057!important;font-weight:900!important} #main-content .professional-calendar .calendar-day.today .calendar-day-number{background:var(--hm6-primary)!important;color:#fff!important} #main-content .professional-calendar .day-item{background:#f5f7fa!important;border:1px solid #e7ebf1!important;color:#3f4d63!important;box-shadow:none!important} #main-content .professional-calendar .day-item.occasion{background:#fff9ed!important;border-color:#f4e5bf!important;color:#79531e!important} #main-content .professional-calendar .day-item.period.blue{background:#f1f8fc!important;border-color:#d8eaf5!important;color:#336b8c!important} #main-content .professional-calendar .day-item.period.pink{background:#fff4f8!important;border-color:#f1dce4!important;color:#91506b!important} #main-content .professional-calendar .day-item.event{background:#f5f3ff!important;border-color:#e3defc!important;color:#5b4ca0!important} #main-content .professional-calendar .holiday-mark{background:#fff0f0!important;color:#b43d3d!important;border:1px solid #f5d4d4!important} /* Hotel-style booking experience */ .booking-overlay{padding:24px!important;align-items:center!important;justify-content:center!important;background:rgba(19,28,44,.42)!important;backdrop-filter:blur(5px)!important} .booking-dialog{width:min(1040px,calc(100vw - 48px));max-height:min(92vh,880px);display:flex;flex-direction:column;background:#fff;border:1px solid rgba(255,255,255,.6);border-radius:22px;box-shadow:var(--hm6-shadow-lg);overflow:hidden;direction:rtl} .booking-dialog-head{flex:0 0 auto;display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:20px 22px 17px;border-bottom:1px solid #edf0f4;background:#fff} .booking-heading{min-width:0}.booking-heading .eyebrow{color:#6d7ca0!important}.booking-heading h2{margin:3px 0 4px;color:#172033;font-size:1.28rem;letter-spacing:-.025em}.booking-heading p{margin:0;color:#7d8798;font-size:.72rem;line-height:1.85} .booking-close{width:38px;height:38px;border:1px solid #e1e6ed!important;border-radius:11px!important;background:#fff!important;color:#667085!important;font-size:22px!important;line-height:1!important;box-shadow:none!important}.booking-close:hover{background:#f6f8fb!important;color:#29354a!important} .booking-form{display:flex;flex-direction:column;min-height:0;flex:1} .booking-layout{display:grid;grid-template-columns:minmax(0,1fr) 286px;gap:0;min-height:0;flex:1;overflow:hidden} .booking-main{padding:0 24px 20px;overflow-y:auto;min-height:0;scrollbar-gutter:stable} .booking-step{padding:20px 0;border-bottom:1px solid #edf0f4}.booking-step:last-of-type{border-bottom:0} .booking-step-head{display:flex;align-items:flex-start;gap:11px;margin-bottom:14px}.booking-step-no{display:grid;place-items:center;width:27px;height:27px;flex:0 0 27px;border-radius:9px;background:var(--hm6-primary-soft);color:#3856c6;font-size:.72rem;font-weight:950}.booking-step-head h3{font-size:.86rem;margin:0 0 3px;color:#243148;font-weight:950}.booking-step-head p{font-size:.64rem;margin:0;color:#8791a2;line-height:1.7} .booking-suite-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.booking-suite-card{position:relative;display:flex;align-items:center;gap:11px;min-height:70px;padding:12px 14px;border:1px solid #dfe5ed;border-radius:14px;background:#fff;cursor:pointer;transition:.16s ease}.booking-suite-card:hover{border-color:#cbd4e2;background:#fbfcfe}.booking-suite-card input{position:absolute;opacity:0;pointer-events:none}.booking-suite-card>i{width:12px;height:12px;border-radius:50%;background:#aab3c0;box-shadow:0 0 0 4px #f2f4f7}.booking-suite-card.blue>i{background:var(--hm6-blue)}.booking-suite-card.pink>i{background:var(--hm6-pink)}.booking-suite-copy{display:grid;gap:3px;min-width:0}.booking-suite-copy b{color:#27344a;font-size:.76rem}.booking-suite-copy small{color:#8a94a5;font-size:.59rem}.booking-suite-check{margin-right:auto;width:22px;height:22px;display:grid;place-items:center;border-radius:50%;background:#eef1f5;color:transparent;font-size:.68rem;font-weight:900}.booking-suite-card:has(input:checked){border-color:#9aabe9;background:#f8faff;box-shadow:0 0 0 3px rgba(63,95,211,.08)}.booking-suite-card:has(input:checked) .booking-suite-check{background:var(--hm6-primary);color:#fff} .booking-date-placeholder{min-height:260px;display:grid;place-items:center;align-content:center;text-align:center;border:1px dashed #d9e0ea;border-radius:16px;background:#fafbfd;padding:26px}.booking-placeholder-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:15px;background:#f0f3fa;color:#60729a;font-size:25px;margin-bottom:10px}.booking-date-placeholder b{font-size:.8rem;color:#354157}.booking-date-placeholder p{font-size:.64rem;color:#8c96a6;margin:5px 0 0} .booking-calendar-shell{border:1px solid #e1e6ee;border-radius:16px;overflow:hidden;background:#fff}.booking-calendar-shell[hidden]{display:none!important}.booking-calendar-toolbar{display:grid;grid-template-columns:38px 1fr 38px;align-items:center;gap:8px;padding:11px 12px;border-bottom:1px solid #edf0f4;background:#fbfcfe}.booking-calendar-toolbar>div{text-align:center;display:grid;gap:2px}.booking-calendar-toolbar b{font-size:.81rem;color:#28364d}.booking-calendar-toolbar small{font-size:.56rem;color:#8c96a7}.booking-month-nav{width:34px;height:34px;border:1px solid #dfe5ee!important;border-radius:10px!important;background:#fff!important;color:#46546b!important;font-size:19px!important;box-shadow:none!important}.booking-month-nav:hover{background:#f5f7fb!important} .booking-weekdays,.booking-date-grid{display:grid;grid-template-columns:repeat(7,1fr);direction:rtl}.booking-weekdays{background:#fff;padding:8px 8px 0}.booking-weekdays span{text-align:center;color:#99a2b1;font-size:.58rem;font-weight:900;padding:4px}.booking-date-grid{padding:7px 8px 10px;gap:4px;min-height:240px}.booking-date-blank{min-height:48px}.booking-date-grid button.booking-date{position:relative;min-height:48px;padding:5px 2px!important;border:1px solid transparent!important;border-radius:10px!important;background:#fff!important;color:#344054!important;box-shadow:none!important;display:grid!important;place-items:center!important;align-content:center!important;gap:1px!important;transform:none!important}.booking-date-grid button.booking-date span{font-size:.72rem;font-weight:900}.booking-date-grid button.booking-date i{font-style:normal;font-size:.48rem;color:#a0a9b6;font-weight:700}.booking-date-grid button.booking-date:hover{background:#f6f8fc!important;border-color:#e1e6ef!important}.booking-date-grid button.booking-date.today{box-shadow:inset 0 0 0 1px #aebceb!important}.booking-date-grid button.booking-date.busy{background:#f5f6f8!important;color:#a7afbb!important;cursor:pointer!important}.booking-date-grid button.booking-date.busy i{color:#b27a7a}.booking-date-grid button.booking-date.checkin,.booking-date-grid button.booking-date.checkout{background:var(--hm6-primary)!important;color:#fff!important;border-color:var(--hm6-primary)!important}.booking-date-grid button.booking-date.checkin i,.booking-date-grid button.booking-date.checkout i{color:#dfe5ff!important}.booking-date-grid button.booking-date.in-range{background:#eef2ff!important;color:#2f4fbd!important;border-radius:4px!important}.booking-calendar-loading,.booking-calendar-error{grid-column:1/-1;min-height:220px;display:grid;place-items:center;text-align:center;color:#7f8a9b;font-size:.7rem}.booking-calendar-error{color:#b94b4b}.booking-calendar-legend{display:flex;gap:14px;align-items:center;padding:9px 12px;border-top:1px solid #edf0f4;background:#fbfcfe;color:#7f899a;font-size:.56rem}.booking-calendar-legend span{display:flex;align-items:center;gap:5px}.booking-calendar-legend i{width:8px;height:8px;border-radius:50%;background:#fff;border:1px solid #cfd6e0}.booking-calendar-legend i.selected{background:var(--hm6-primary);border-color:var(--hm6-primary)}.booking-calendar-legend i.busy{background:#d8dce2;border-color:#d8dce2} .booking-date-summary{display:grid;grid-template-columns:1fr auto 1fr 78px;gap:8px;align-items:center;margin-top:10px}.booking-date-summary>div:not(.booking-night-count){border:1px solid #e1e6ee;border-radius:12px;padding:9px 11px;background:#fff;display:grid;gap:3px}.booking-date-summary small{font-size:.54rem;color:#929baa}.booking-date-summary b{font-size:.68rem;color:#344054}.booking-stay-arrow{color:#a1a9b6;font-size:16px}.booking-night-count{height:100%;min-height:50px;display:flex;align-items:center;justify-content:center;gap:4px;border-radius:12px;background:#f2f5ff;color:#3855bd}.booking-night-count strong{font-size:1.03rem}.booking-night-count span{font-size:.57rem;font-weight:800}.booking-inline-message{margin:9px 0 0;padding:8px 10px;border-radius:9px;background:var(--hm6-danger-soft);color:#a63d3d;font-size:.61rem}.booking-inline-message[data-tone="info"],.booking-inline-message[data-tone="loading"]{background:#f3f6fc;color:#53647f}.booking-inline-message[data-tone="success"]{background:var(--hm6-success-soft);color:#147153} .booking-owner-picker .owner-search-control>input{height:46px!important;border-radius:12px!important}.booking-owner-picker #periodOwnerResults{box-shadow:0 12px 30px rgba(30,43,67,.08)!important}.booking-owner-picker .owner-result.is-disabled{opacity:.55!important;cursor:not-allowed!important}.booking-owner-picker .owner-result em{font-style:normal!important;font-size:.56rem!important;color:#718099!important} .booking-extra{margin:18px 0 2px;border:1px solid #e3e8ef;border-radius:12px;background:#fbfcfd}.booking-extra summary{cursor:pointer;padding:11px 13px;color:#536076;font-size:.68rem;font-weight:900}.booking-extra summary small{font-size:.54rem;color:#9aa3b2;margin-right:4px}.booking-extra label{display:grid;gap:6px;padding:0 13px 13px}.booking-extra label>span{font-size:.6rem;color:#7d8798} .booking-summary-card{background:#f8faff;border-right:1px solid #e5e9f1;padding:24px 20px;display:flex;flex-direction:column;align-self:stretch}.booking-summary-icon{width:46px;height:46px;display:grid;place-items:center;border-radius:15px;background:#fff;border:1px solid #e2e7f1;color:#536abf;font-size:24px;margin-bottom:18px}.booking-summary-card h3{font-size:.92rem;color:#253149;margin:4px 0 18px;line-height:1.6}.booking-summary-card dl{margin:0;display:grid;gap:0}.booking-summary-card dl>div{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid #e7ebf3}.booking-summary-card dt{font-size:.58rem;color:#8a94a5}.booking-summary-card dd{margin:0;font-size:.62rem;color:#354258;font-weight:900;text-align:left}.booking-summary-status{margin-top:auto;display:flex;align-items:center;gap:8px;padding:10px 11px;border-radius:10px;background:#fff;border:1px solid #e3e8f1;color:#738096;font-size:.59rem;line-height:1.7}.booking-summary-status i{width:8px;height:8px;border-radius:50%;background:#aeb7c3}.booking-summary-status.ready{background:var(--hm6-success-soft);border-color:#cceadd;color:#196c53}.booking-summary-status.ready i{background:var(--hm6-success)} .booking-form-message{margin:0 22px 10px;padding:10px 12px;border-radius:10px;background:var(--hm6-danger-soft);color:#a63d3d;border:1px solid #f3d3d3;font-size:.65rem}.booking-form-message[data-tone="success"]{background:var(--hm6-success-soft);color:#176b52;border-color:#cce8dd} .booking-actions{display:flex;justify-content:flex-end;gap:9px;padding:13px 22px;border-top:1px solid #edf0f4;background:#fff}.booking-submit{min-width:150px;display:flex!important;align-items:center!important;justify-content:center!important;gap:7px!important}.booking-submit span{font-weight:900}.booking-submit small{font-size:.5rem;opacity:.72}.booking-submit.is-loading{opacity:.7;cursor:wait} @media(max-width:980px){ .app-shell .content{padding:16px 18px 30px!important}.booking-dialog{width:min(900px,calc(100vw - 24px))}.booking-layout{grid-template-columns:1fr 240px}.booking-main{padding-inline:18px}.booking-summary-card{padding:20px 16px} } @media(max-width:760px){ .app-shell .content{padding:12px 12px 28px!important}.app-shell .topbar{height:54px!important;min-height:54px!important;padding:0 12px!important} .booking-overlay{padding:0!important;align-items:flex-end!important}.booking-dialog{width:100%;height:min(94svh,860px);max-height:94svh;border-radius:20px 20px 0 0;border-bottom:0}.booking-dialog-head{padding:16px 15px 13px}.booking-heading p{display:none}.booking-layout{display:flex;flex-direction:column;overflow-y:auto}.booking-main{overflow:visible;padding:0 14px 18px;order:2}.booking-summary-card{order:1;border-right:0;border-bottom:1px solid #e8ecf2;background:#fafbff;padding:12px 14px;display:grid;grid-template-columns:1fr auto;gap:5px 12px}.booking-summary-icon,.booking-summary-card>.eyebrow{display:none}.booking-summary-card h3{margin:0;font-size:.75rem}.booking-summary-card dl{grid-column:1/-1;grid-template-columns:repeat(4,1fr);gap:6px}.booking-summary-card dl>div{display:grid;gap:2px;border:0;padding:5px 7px;background:#fff;border-radius:8px;border:1px solid #e7ebf2}.booking-summary-card dt{font-size:.48rem}.booking-summary-card dd{font-size:.55rem;text-align:right}.booking-summary-card dl>div:last-child{display:none}.booking-summary-status{margin:0;align-self:center;padding:6px 8px}.booking-summary-status span{display:none}.booking-step{padding:16px 0}.booking-suite-grid{grid-template-columns:1fr 1fr}.booking-suite-card{min-height:62px;padding:10px}.booking-date-placeholder{min-height:200px}.booking-date-grid{min-height:0}.booking-date-grid button.booking-date{min-height:44px}.booking-date-summary{grid-template-columns:1fr auto 1fr}.booking-night-count{grid-column:1/-1;min-height:38px}.booking-actions{padding:10px 14px calc(10px + env(safe-area-inset-bottom));position:sticky;bottom:0;z-index:5}.booking-actions .button{flex:1}.booking-submit{min-width:0}.booking-submit small{display:none}.booking-form-message{margin:0 14px 8px} } @media(max-width:480px){ .booking-suite-grid{grid-template-columns:1fr}.booking-weekdays span{font-size:.52rem}.booking-date-grid{gap:2px;padding-inline:4px}.booking-date-grid button.booking-date{min-height:41px;border-radius:8px!important}.booking-date-grid button.booking-date span{font-size:.66rem}.booking-date-grid button.booking-date i{display:none}.booking-calendar-legend{gap:8px;flex-wrap:wrap}.booking-summary-card dl{grid-template-columns:1fr 1fr}.booking-summary-card dl>div:nth-child(4){display:grid}.booking-step-head p{font-size:.58rem}.booking-dialog-head h2{font-size:1.05rem} } /* Product-level polish across non-calendar pages */ .app-shell .ds-page-header{display:flex!important;align-items:flex-end!important;justify-content:space-between!important;gap:18px!important;margin:4px 0 18px!important;padding:0 2px!important}.app-shell .ds-page-header h1{margin:0 0 5px!important;color:#182337!important;font-size:1.28rem!important;letter-spacing:-.025em!important}.app-shell .ds-page-header p{margin:0!important;color:#7e899a!important;font-size:.72rem!important} .app-shell .form-grid{gap:14px!important}.app-shell .form-grid>label,.app-shell form>label{color:#4d596d!important;font-size:.66rem!important;font-weight:900!important}.app-shell .form-grid>label>input,.app-shell .form-grid>label>select,.app-shell .form-grid>label>textarea{margin-top:7px!important;border-radius:11px!important;min-height:45px!important}.app-shell .form-grid textarea{min-height:92px!important} .app-shell .panel{border-radius:16px!important;padding:20px!important}.app-shell .panel-head{border-bottom:0!important;margin-bottom:14px!important}.app-shell .panel-head h2{color:#202c42!important;font-size:.95rem!important}.app-shell .panel-head p{color:#8791a3!important;font-size:.64rem!important}.app-shell .panel-kicker,.app-shell .eyebrow{color:#7a86a0!important;letter-spacing:0!important;font-weight:900!important} .app-shell .table-wrap{border:1px solid var(--hm6-border)!important;border-radius:13px!important;overflow:auto!important;background:#fff!important}.app-shell table{border-collapse:separate!important;border-spacing:0!important}.app-shell thead th{background:#f8fafc!important;color:#6f7b8e!important;font-size:.61rem!important;font-weight:900!important;border-bottom:1px solid #e7ebf1!important}.app-shell tbody td{color:#364258!important;border-bottom:1px solid #eef1f5!important}.app-shell tbody tr:hover td{background:#fbfcfe!important} .app-shell .flash{border-radius:11px!important;border-width:1px!important;box-shadow:none!important}.app-shell .flash.danger{background:#fff6f6!important;border-color:#f2d6d6!important;color:#a43d3d!important}.app-shell .flash.success{background:#f2fbf7!important;border-color:#d5eee3!important;color:#176d53!important} .app-shell .section-hub-hero{background:#fff!important;border:1px solid var(--hm6-border)!important;border-radius:18px!important;box-shadow:var(--hm6-shadow)!important;padding:24px!important;min-height:0!important}.app-shell .section-hub-icon{background:var(--hm6-primary-soft)!important;color:var(--hm6-primary)!important;border:1px solid #dfe5ff!important;box-shadow:none!important}.app-shell .section-hub-copy h1{color:#1b2740!important;font-size:1.42rem!important;letter-spacing:-.03em!important}.app-shell .section-hub-copy p{color:#7a8597!important;max-width:720px!important}.app-shell .section-hub-grid{gap:14px!important}.app-shell .section-hub-card{background:#fff!important;border:1px solid var(--hm6-border)!important;border-radius:15px!important;box-shadow:none!important;transition:.16s ease!important}.app-shell .section-hub-card:hover{border-color:#cfd7e5!important;box-shadow:0 10px 28px rgba(23,32,51,.06)!important;transform:translateY(-1px)!important}.app-shell .section-hub-card-icon{background:#f5f7fb!important;color:#58677f!important}.app-shell .section-hub-card-copy strong{color:#263249!important}.app-shell .section-hub-card-copy small{color:#858fa0!important;line-height:1.8!important}.app-shell .section-hub-arrow{color:#a0a9b7!important} .app-shell .dashboard-commandbar{background:#fff!important;border:1px solid var(--hm6-border)!important;border-radius:18px!important;box-shadow:var(--hm6-shadow)!important}.app-shell .dashboard-commandbar h2{color:#1c2840!important}.app-shell .dashboard-commandbar p{color:#7d8899!important}.app-shell .stat-card{background:#fff!important;border:1px solid var(--hm6-border)!important;box-shadow:none!important;border-radius:15px!important}.app-shell .stat-card:hover{border-color:#d4dbe6!important;box-shadow:0 8px 24px rgba(23,32,51,.05)!important}.app-shell .stat-card strong{color:#1d293d!important}.app-shell .stat-card span,.app-shell .stat-card small{color:#7e899b!important}.app-shell .stat-icon{background:#f5f7fb!important;color:#5d6a80!important;box-shadow:none!important} .app-shell .status-chip{border:1px solid #e0e5ed!important;box-shadow:none!important}.app-shell .status-chip.allocated{background:#eff8f4!important;color:#197055!important;border-color:#d6ece2!important}.app-shell .status-chip.free{background:#f3f6ff!important;color:#4960b4!important;border-color:#dfe5fb!important} @media(max-width:760px){.app-shell .section-hub-hero{padding:18px!important;border-radius:15px!important}.app-shell .section-hub-copy h1{font-size:1.12rem!important}.app-shell .panel{padding:15px!important}.app-shell .ds-page-header{margin-top:2px!important}.app-shell .ds-page-header h1{font-size:1.08rem!important}} /* ===== hammelk-enterprise-v7.css ===== */ /* Hammelk Enterprise UI v7 Final visual layer: calm white workspace, accessible contrast, hotel-style booking. */ :root{ --hm7-bg:#ffffff; --hm7-surface:#ffffff; --hm7-surface-2:#fbfcfe; --hm7-text:#172033; --hm7-muted:#667085; --hm7-soft:#8b95a7; --hm7-border:#e5eaf1; --hm7-border-strong:#d7dfeb; --hm7-accent:#7895e8; --hm7-accent-strong:#6786dc; --hm7-accent-soft:#eef2ff; --hm7-accent-faint:#f7f9ff; --hm7-blue:#62add8; --hm7-blue-soft:#eef8fd; --hm7-pink:#e487ad; --hm7-pink-soft:#fff2f7; --hm7-danger:#d95858; --hm7-danger-soft:#fff3f3; --hm7-success:#2f9b78; --hm7-success-soft:#eefaf6; --hm7-warning:#c78b35; --hm7-warning-soft:#fff8eb; --hm7-shadow:0 10px 32px rgba(31,42,68,.07); --hm7-shadow-lg:0 22px 70px rgba(25,39,68,.14); } html,body{background:var(--hm7-bg)!important;color:var(--hm7-text)!important} body{font-feature-settings:"ss01" 1,"tnum" 1} .app-shell{background:var(--hm7-bg)!important} .app-shell .workspace{background:var(--hm7-bg)!important} .app-shell .page-content{max-width:1680px;width:100%;margin-inline:auto;padding-top:22px!important} /* Top bar: visually integrated with the product, not a floating card. */ .app-shell .topbar,.app-shell .topbar.topbar-modern{ background:rgba(255,255,255,.96)!important; border-bottom:1px solid var(--hm7-border)!important; box-shadow:0 1px 0 rgba(23,32,51,.02)!important; backdrop-filter:saturate(140%) blur(12px); } .app-shell .topbar-title>b{color:#202b3d!important;font-weight:850!important;letter-spacing:-.02em} .app-shell .topbar-meta,.app-shell .topbar-meta small{color:#8993a4!important} .app-shell .topbar-quick{background:#fff!important;border:1px solid var(--hm7-border)!important;color:#4e5b70!important} .app-shell .topbar-quick:hover{background:var(--hm7-accent-faint)!important;border-color:#cad5fb!important;color:#4f6ed5!important} .app-shell .icon-button{background:#fff!important;border-color:var(--hm7-border)!important;color:#536176!important} /* Sidebar */ .app-shell .sidebar{background:#fff!important;border-left:1px solid var(--hm7-border)!important;box-shadow:none!important} .app-shell .brand{border-bottom:1px solid #edf1f6!important} .app-shell .brand-copy strong{color:#202a3b!important} .app-shell .brand-copy span{color:#717d90!important} .app-shell .sidebar-property{ background:linear-gradient(180deg,#fff 0%,#fbfcff 100%)!important; border:1px solid var(--hm7-border)!important; box-shadow:0 6px 20px rgba(40,54,82,.035)!important; } .app-shell .suite-overview-head small{color:#4b586d!important;font-weight:850!important} .app-shell .property-year{background:#f2f5fa!important;border:1px solid #e2e8f1!important;color:#536176!important;font-weight:800!important} .app-shell .suite-overview-item{ background:#fff!important;border:1px solid #e6ebf2!important;color:#273247!important;opacity:1!important; min-width:0!important } .app-shell .suite-overview-item b{color:#273247!important;opacity:1!important;font-weight:850!important;text-shadow:none!important} .app-shell .suite-overview-item .suite-color-dot.blue{background:var(--hm7-blue)!important;box-shadow:0 0 0 4px var(--hm7-blue-soft)!important} .app-shell .suite-overview-item .suite-color-dot.pink{background:var(--hm7-pink)!important;box-shadow:0 0 0 4px var(--hm7-pink-soft)!important} .app-shell .sidebar-nav .menu-section{ color:#445166!important;border:1px solid transparent!important;background:transparent!important;font-weight:780!important } .app-shell .sidebar-nav .menu-section:hover{background:#f8faff!important;color:#33415a!important} .app-shell .sidebar-nav .menu-section.active{ color:#4d6dda!important;background:#f1f4ff!important;border-color:#dce4ff!important; box-shadow:inset -3px 0 0 #6f8df7!important } .app-shell .sidebar-nav .menu-section.active .icon{color:#5f7fee!important} .app-shell .menu-open-mark{color:#a1aabb!important} /* PWA install is a real action, not a disabled-looking ghost. */ .app-shell #installApp.sidebar-install{ color:#4d5f7d!important;background:#f8faff!important;border:1px solid #dce4f3!important; opacity:1!important;font-weight:850!important;box-shadow:none!important } .app-shell #installApp.sidebar-install:hover{color:#4967ca!important;background:#eef3ff!important;border-color:#c5d3ff!important} .app-shell #installApp.sidebar-install[hidden]{display:none!important} /* General product surfaces */ .app-shell .panel,.app-shell .page-hero,.app-shell .section-hub-hero,.app-shell .section-hub-card, .app-shell .dashboard-card,.app-shell .card,.app-shell .stat-card{ background:#fff!important;border:1px solid var(--hm7-border)!important;box-shadow:var(--hm7-shadow)!important } .app-shell .panel,.app-shell .section-hub-card,.app-shell .page-hero{border-radius:18px!important} .app-shell .section-hub-card{transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease!important} .app-shell .section-hub-card:hover{transform:translateY(-2px)!important;border-color:#d2dcf1!important;box-shadow:0 14px 34px rgba(37,50,82,.09)!important} .app-shell h1,.app-shell h2,.app-shell h3{color:#1d2738!important;letter-spacing:-.025em} .app-shell .eyebrow{color:#6e7b90!important;font-weight:850!important;letter-spacing:.015em} .app-shell p,.app-shell small,.app-shell .muted{color:var(--hm7-muted)!important} .app-shell input,.app-shell select,.app-shell textarea{ background:#fff!important;color:#253147!important;border:1px solid #dce3ed!important;border-radius:11px!important; box-shadow:0 1px 0 rgba(26,36,56,.015)!important } .app-shell input:focus,.app-shell select:focus,.app-shell textarea:focus{ border-color:#9fb2f3!important;box-shadow:0 0 0 4px rgba(111,141,247,.12)!important;outline:none!important } .app-shell .button.primary,.app-shell button.button:not(.secondary):not(.danger){ background:var(--hm7-accent)!important;border-color:var(--hm7-accent)!important;color:#fff!important; box-shadow:0 7px 18px rgba(88,119,232,.18)!important } .app-shell .button.primary:hover,.app-shell button.button:not(.secondary):not(.danger):hover{background:var(--hm7-accent-strong)!important;border-color:var(--hm7-accent-strong)!important} .app-shell .button.secondary{background:#fff!important;border-color:#dce3ed!important;color:#48566d!important;box-shadow:none!important} .app-shell .button.secondary:hover{background:#f8faff!important;border-color:#cad5e7!important} /* Tables */ .app-shell table{background:#fff!important;border-collapse:separate!important;border-spacing:0!important} .app-shell thead th{background:#f8fafc!important;color:#607086!important;border-bottom:1px solid #e4eaf2!important;font-weight:850!important} .app-shell tbody td{border-bottom:1px solid #edf1f6!important;color:#2c374b!important} .app-shell tbody tr:hover td{background:#fbfcff!important} /* Main calendar becomes a crisp white scheduling surface. */ .app-shell .calendar-command-center,.app-shell .calendar-board,.app-shell .calendar-agenda-card{ background:#fff!important;border:1px solid var(--hm7-border)!important;box-shadow:var(--hm7-shadow)!important } .app-shell .calendar-command-center{border-radius:18px!important} .app-shell .calendar-board{border-radius:16px!important;overflow:hidden!important} .app-shell .calendar-week-head{background:#f8fafc!important;border-bottom:1px solid var(--hm7-border)!important} .app-shell .calendar-week-head>span{color:#6e7b8f!important;font-weight:820!important} .app-shell .calendar-day:not(.empty){ background:#fff!important;color:#2c374b!important;border:0!important;border-left:1px solid #e8edf3!important;border-bottom:1px solid #e8edf3!important; box-shadow:none!important;border-radius:0!important;transition:background .14s ease,box-shadow .14s ease!important } .app-shell .calendar-day:not(.empty):hover{background:#fafbff!important;box-shadow:inset 0 0 0 2px #e5eaff!important} .app-shell .calendar-day.today:not(.empty){background:#f8faff!important;box-shadow:inset 0 0 0 2px #b8c7fa!important} .app-shell .calendar-day.holiday:not(.empty){background:#fffdfd!important} .app-shell .calendar-day-number{color:#354258!important;background:#f4f6f9!important} .app-shell .calendar-day.today .calendar-day-number{background:var(--hm7-accent)!important;color:#fff!important} .app-shell .day-item{background:#f8fafc!important;border:1px solid #e7ebf1!important;color:#536177!important;box-shadow:none!important} .app-shell .day-item.period.blue{background:var(--hm7-blue-soft)!important;border-color:#d3ebf7!important;color:#356985!important} .app-shell .day-item.period.pink{background:var(--hm7-pink-soft)!important;border-color:#f0d6e1!important;color:#935373!important} .app-shell .day-item.event{background:#f4f1ff!important;border-color:#e5ddff!important;color:#6b5aa4!important} .app-shell .day-item.occasion{background:#fffaf0!important;border-color:#f2e7c7!important;color:#806a35!important} .app-shell .holiday-mark{background:var(--hm7-danger-soft)!important;color:#c65353!important;border:1px solid #f2cece!important} /* Hotel booking dialog */ .app-shell .booking-overlay{background:rgba(31,40,58,.34)!important;backdrop-filter:blur(6px)!important} .app-shell .booking-dialog{background:#fff!important;border:1px solid #e4e9f1!important;box-shadow:var(--hm7-shadow-lg)!important;border-radius:22px!important;overflow:hidden!important} .app-shell .booking-dialog-head{background:#fff!important;border-bottom:1px solid #e8edf3!important} .app-shell .booking-close{background:#f1f4ff!important;color:#5574df!important;border:1px solid #d9e1ff!important;box-shadow:none!important} .app-shell .booking-step{border-bottom:1px solid #edf1f5!important;background:#fff!important} .app-shell .booking-step-no{background:#eef2ff!important;color:#5b77db!important} .app-shell .booking-step-head h3{color:#202c3f!important} .app-shell .booking-suite-card{background:#fff!important;border:1px solid #dfe5ee!important;color:#334158!important;box-shadow:none!important} .app-shell .booking-suite-card:hover{border-color:#c7d3e8!important;background:#fcfdff!important} .app-shell .booking-suite-card:has(input:checked){background:#f6f8ff!important;border-color:#9fb2f3!important;box-shadow:0 0 0 3px rgba(111,141,247,.10)!important} .app-shell .booking-suite-card.blue:has(input:checked){background:#f3faff!important;border-color:#abd9ef!important} .app-shell .booking-suite-card.pink:has(input:checked){background:#fff5f8!important;border-color:#ecc2d3!important} .app-shell .booking-suite-check{background:var(--hm7-accent)!important;color:#fff!important} .app-shell .booking-calendar-shell{background:#fff!important;border:1px solid #e1e7ef!important;border-radius:15px!important;overflow:hidden!important} .app-shell .booking-calendar-toolbar{background:#fbfcfe!important;border-bottom:1px solid #e7ecf2!important} .app-shell .booking-month-nav{background:#f1f4ff!important;color:#5574df!important;border:1px solid #d9e1ff!important;box-shadow:none!important} .app-shell .booking-weekdays{background:#fff!important;color:#8a95a6!important} /* IMPORTANT: a free date is white. Only the chosen range becomes colored. */ .app-shell .booking-date-grid .booking-date{ background:#fff!important;color:#2f3b50!important;border:1px solid #e1e7ef!important;border-radius:10px!important; box-shadow:none!important;min-height:52px!important;transition:background .12s ease,border-color .12s ease,transform .12s ease!important } .app-shell .booking-date-grid .booking-date:hover:not(.busy){background:#f9fbff!important;border-color:#bfcdf4!important;transform:translateY(-1px)!important} .app-shell .booking-date-grid .booking-date i{color:#9aa4b3!important;font-weight:700!important} .app-shell .booking-date-grid .booking-date.today{box-shadow:inset 0 0 0 2px #d7e0ff!important;border-color:#bccaf8!important} .app-shell .booking-date-grid .booking-date.in-range{ background:#eef3ff!important;color:#405dbd!important;border-color:#c9d5ff!important;box-shadow:none!important } .app-shell .booking-date-grid .booking-date.checkin, .app-shell .booking-date-grid .booking-date.checkout{ background:#dfe8ff!important;color:#314fae!important;border-color:#8ea7f2!important;box-shadow:inset 0 0 0 2px #adc0f8!important } .app-shell .booking-date-grid .booking-date.checkin i, .app-shell .booking-date-grid .booking-date.checkout i, .app-shell .booking-date-grid .booking-date.in-range i{color:#5572cb!important} .app-shell .booking-date-grid .booking-date.busy{ background:#f1f3f6!important;color:#9aa3b1!important;border-color:#e4e8ed!important;cursor:not-allowed!important;opacity:.82!important } .app-shell .booking-date-grid .booking-date.busy i{color:#a2aab7!important} .app-shell .booking-calendar-legend .free{background:#fff!important;border:1px solid #dfe5ed!important} .app-shell .booking-calendar-legend .selected{background:#dfe8ff!important;border:1px solid #9db1ef!important} .app-shell .booking-calendar-legend .busy{background:#eceff3!important;border:1px solid #dde2e8!important} .app-shell .booking-date-summary{background:#f8faff!important;border:1px solid #e1e7f5!important} .app-shell .booking-summary-card{background:linear-gradient(180deg,#fbfcff,#f7f9fd)!important;border-left:1px solid #e6ebf2!important;color:#2f3b50!important} .app-shell .booking-summary-status.ready{background:var(--hm7-success-soft)!important;color:#25785f!important;border-color:#ccebdd!important} /* Quota approval and owner selector */ .app-shell .owner-picker-results{background:#fff!important;border:1px solid #dde4ee!important;box-shadow:0 16px 42px rgba(25,39,68,.13)!important} .app-shell #periodOwnerResults .owner-result{background:#fff!important;color:#2b374b!important;border-bottom:1px solid #edf1f5!important;opacity:1!important} .app-shell #periodOwnerResults .owner-result:hover{background:#f8faff!important} .app-shell #periodOwnerResults .owner-result.quota-full{background:#fffaf2!important} .app-shell #periodOwnerResults .owner-result.quota-full em{background:#fff1d8!important;color:#9a6d2b!important} .app-shell .owner-selected-summary{background:#f8faff!important;border:1px solid #e0e6f5!important} .app-shell .quota-approval-card{margin-top:12px;padding:14px;border-radius:14px;background:var(--hm7-warning-soft)!important;border:1px solid #f0dfb8!important;display:grid;gap:11px} .app-shell .quota-approval-card[hidden]{display:none!important} .app-shell .quota-approval-head{display:flex;align-items:flex-start;gap:10px} .app-shell .quota-warning-icon{width:27px;height:27px;border-radius:9px;display:grid;place-items:center;background:#fff0cd;color:#9a6a24;font-weight:900;flex:0 0 auto} .app-shell .quota-approval-head div{display:grid;gap:3px}.app-shell .quota-approval-head b{color:#70511f!important}.app-shell .quota-approval-head small{color:#94723a!important;line-height:1.65} .app-shell .quota-approval-check{display:flex!important;align-items:center;gap:8px!important;background:#fff!important;border:1px solid #eedfbf!important;padding:10px 12px!important;border-radius:11px!important;color:#604a25!important} .app-shell .quota-approval-check input{width:18px!important;height:18px!important;box-shadow:none!important} .app-shell .quota-approval-note{display:grid!important;gap:6px!important}.app-shell .quota-approval-note span{font-weight:800;color:#70511f!important} /* Communications API center */ .app-shell .comms-hero{display:flex;align-items:center;justify-content:space-between;gap:24px} .app-shell .hero-status{display:flex;align-items:center;gap:8px;padding:10px 13px;border-radius:999px;background:#f6f8fb;border:1px solid #e3e8ef;color:#5d6a7d;white-space:nowrap} .app-shell .hero-status i{width:8px;height:8px;border-radius:50%;background:#a0a9b7}.app-shell .hero-status.ok{background:var(--hm7-success-soft);border-color:#d2ece2;color:#26745c}.app-shell .hero-status.ok i{background:#42a987}.app-shell .hero-status.warn{background:var(--hm7-warning-soft);border-color:#f1dfb6;color:#8b672e}.app-shell .hero-status.warn i{background:#d5a34b} .app-shell .provider-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:18px} .app-shell .provider-card{position:relative;background:#fff;border:1px solid var(--hm7-border);border-radius:18px;box-shadow:var(--hm7-shadow);overflow:hidden;padding:18px} .app-shell .provider-card.enabled{border-color:#d4def8}.app-shell .provider-head{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;padding-bottom:15px;border-bottom:1px solid #edf1f5} .app-shell .provider-mark{width:42px;height:42px;border-radius:13px;background:#f0f4ff;color:#5875dc;display:grid;place-items:center;font-weight:900;font-size:1.05rem}.app-shell .provider-head h2{margin:0 0 3px;font-size:1rem}.app-shell .provider-head p{margin:0;font-size:.75rem}.app-shell .provider-state{font-size:.72rem;padding:6px 9px;border-radius:999px;background:#f2f4f7;color:#687386}.app-shell .provider-state.ok{background:var(--hm7-success-soft);color:#28755e}.app-shell .provider-state.error{background:var(--hm7-danger-soft);color:#ad4d4d} .app-shell .provider-form{display:grid;gap:14px;padding-top:15px}.app-shell .switch-line{display:flex!important;align-items:center;justify-content:space-between;gap:15px;padding:10px 12px;background:#fafbfc;border:1px solid #edf0f4;border-radius:12px}.app-shell .switch-line span{display:grid;gap:2px}.app-shell .switch-line b{font-size:.82rem;color:#344158}.app-shell .switch-line input{width:20px!important;height:20px!important;box-shadow:none!important} .app-shell .provider-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.app-shell .provider-fields label{display:grid!important;gap:6px!important}.app-shell .provider-fields label.wide{grid-column:1/-1}.app-shell .provider-fields label>span{font-size:.76rem;font-weight:800;color:#536074}.app-shell .provider-fields label>small{font-size:.67rem}.app-shell .provider-last-error{padding:10px 12px;border-radius:10px;background:var(--hm7-danger-soft);border:1px solid #f2d2d2;color:#9f4b4b;font-size:.76rem}.app-shell .provider-actions{display:flex;justify-content:flex-end}.app-shell .provider-test-form{position:absolute;left:18px;bottom:18px}.app-shell .comms-note{margin-top:18px} /* Audit timeline */ .app-shell .audit-timeline-panel{margin-top:18px}.app-shell .audit-timeline{display:grid}.app-shell .audit-item{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:start;padding:13px 4px;border-bottom:1px solid #edf1f5}.app-shell .audit-item:last-child{border-bottom:0}.app-shell .audit-dot{width:9px;height:9px;border-radius:50%;background:#8ea7f2;margin-top:6px;box-shadow:0 0 0 4px #f0f4ff}.app-shell .audit-copy{display:grid;gap:3px}.app-shell .audit-copy b{color:#2e3a4f}.app-shell .audit-copy span{font-size:.77rem;color:#5e6b7f}.app-shell .audit-copy small{font-size:.7rem}.app-shell .audit-meta{text-align:left;display:grid;gap:3px;color:#748096;font-size:.7rem} @media(max-width:1000px){ .app-shell .provider-grid{grid-template-columns:1fr} .app-shell .comms-hero{align-items:flex-start;flex-direction:column} } @media(max-width:760px){ .app-shell .page-content{padding:14px 10px 82px!important} .app-shell .booking-dialog{border-radius:18px 18px 0 0!important;max-height:94dvh!important} .app-shell .booking-layout{grid-template-columns:1fr!important} .app-shell .booking-summary-card{border-left:0!important;border-top:1px solid #e7ebf2!important} .app-shell .booking-date-grid .booking-date{min-height:44px!important;border-radius:8px!important;padding:5px 2px!important} .app-shell .booking-date-grid .booking-date i{font-size:.55rem!important} .app-shell .provider-card{padding:14px}.app-shell .provider-fields{grid-template-columns:1fr}.app-shell .provider-fields label.wide{grid-column:auto}.app-shell .provider-test-form{position:static;margin-top:10px;display:flex;justify-content:flex-end} .app-shell .audit-item{grid-template-columns:auto 1fr}.app-shell .audit-meta{grid-column:2;text-align:right} } /* Provider test-send affordance: explicit, compact and non-intrusive. */ .app-shell .provider-send-test{margin-top:14px;border-top:1px solid #edf1f5;padding-top:12px} .app-shell .provider-send-test summary{cursor:pointer;color:#526177;font-size:.78rem;font-weight:850;list-style:none;display:flex;align-items:center;gap:7px} .app-shell .provider-send-test summary::-webkit-details-marker{display:none} .app-shell .provider-send-test summary::before{content:'+';width:20px;height:20px;border-radius:7px;background:#f1f4ff;color:#617dde;display:grid;place-items:center;font-weight:900} .app-shell .provider-send-test[open] summary::before{content:'−'} .app-shell .provider-send-test form{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:9px;align-items:end;padding-top:11px} .app-shell .provider-send-test label{display:grid;gap:5px}.app-shell .provider-send-test label>span{font-size:.72rem;font-weight:800;color:#5a687d} .app-shell .provider-adapter-note{margin-top:14px;padding:10px 12px;border-radius:10px;background:#f8fafc;border:1px dashed #dfe5ed;color:#728096;font-size:.72rem;line-height:1.7} @media(max-width:760px){.app-shell .provider-send-test form{grid-template-columns:1fr}.app-shell .provider-send-test form .button{width:100%}} .app-shell .provider-test-form{position:static!important;margin-top:10px;display:flex;justify-content:flex-start} /* ===== hammelk-design-system-v8.css ===== */ /* * Hammelk Design System v8 * Central visual language inspired by the mature AutoGallery Sadra UI: * white-first surfaces, navy typography, calm blue/teal accents, pastel status colors, * restrained shadows, predictable interaction states and mobile parity. * This file is intentionally loaded LAST and is the single visual authority. */ :root{ --hm8-canvas:#ffffff; --hm8-surface:#ffffff; --hm8-surface-soft:#f8fafc; --hm8-surface-tint:#f5f8fc; --hm8-line:#e3e9f1; --hm8-line-strong:#d4deea; --hm8-text:#1f2f46; --hm8-text-strong:#16263e; --hm8-muted:#6f7f93; --hm8-muted-2:#95a2b2; --hm8-navy:#263f61; --hm8-primary:#6684d5; --hm8-primary-hover:#5574ca; --hm8-primary-soft:#eef3ff; --hm8-primary-softer:#f6f8ff; --hm8-teal:#4b8f84; --hm8-teal-soft:#edf8f5; --hm8-gold:#c9a45c; --hm8-gold-soft:#fff8e9; --hm8-blue:#70afd4; --hm8-blue-soft:#edf8fe; --hm8-pink:#d887aa; --hm8-pink-soft:#fff2f7; --hm8-success:#39816d; --hm8-success-soft:#edf8f4; --hm8-danger:#bd5d5d; --hm8-danger-soft:#fff3f3; --hm8-warning:#9b783b; --hm8-warning-soft:#fff9ed; --hm8-radius-xs:8px; --hm8-radius-sm:11px; --hm8-radius-md:15px; --hm8-radius-lg:20px; --hm8-radius-xl:26px; --hm8-shadow-xs:0 2px 8px rgba(24,42,69,.035); --hm8-shadow-sm:0 8px 24px rgba(24,42,69,.055); --hm8-shadow-md:0 18px 48px rgba(24,42,69,.095); --hm8-focus:0 0 0 3px rgba(102,132,213,.14); /* bridge all older theme variables to the new centralized palette */ --ds-primary:var(--hm8-primary);--ds-primary-hover:var(--hm8-primary-hover);--ds-primary-soft:var(--hm8-primary-soft); --ds-bg:var(--hm8-canvas);--ds-surface:var(--hm8-surface);--ds-surface-alt:var(--hm8-surface-soft);--ds-border:var(--hm8-line); --ds-text:var(--hm8-text);--ds-muted:var(--hm8-muted);--ds-success:var(--hm8-success);--ds-success-soft:var(--hm8-success-soft); --ds-danger:var(--hm8-danger);--ds-danger-soft:var(--hm8-danger-soft);--ds-warning:var(--hm8-warning);--ds-warning-soft:var(--hm8-warning-soft); --primary:var(--hm8-primary);--primary-2:var(--hm8-primary-hover);--bg:var(--hm8-canvas);--surface:var(--hm8-surface);--surface-2:var(--hm8-surface-soft);--line:var(--hm8-line);--text:var(--hm8-text);--muted:var(--hm8-muted);--danger:var(--hm8-danger); --hm-primary:var(--hm8-primary);--hm-primary-hover:var(--hm8-primary-hover);--hm-subtle:var(--hm8-surface-soft);--hm-subtle-2:var(--hm8-primary-soft);--hm-line:var(--hm8-line);--hm-danger:var(--hm8-danger); --hm5-primary:var(--hm8-primary);--hm5-blue:var(--hm8-blue);--hm5-pink:var(--hm8-pink); --hm6-primary:var(--hm8-primary);--hm6-primary-soft:var(--hm8-primary-soft);--hm6-blue:var(--hm8-blue);--hm6-pink:var(--hm8-pink);--hm6-success:var(--hm8-success);--hm6-success-soft:var(--hm8-success-soft);--hm6-danger-soft:var(--hm8-danger-soft);--hm6-border:var(--hm8-line); --hm7-accent:var(--hm8-primary);--hm7-accent-strong:var(--hm8-primary-hover);--hm7-success-soft:var(--hm8-success-soft); } /* ---------- Core canvas & typography ---------- */ html{font-size:16px!important;background:var(--hm8-canvas)!important} body{background:var(--hm8-canvas)!important;color:var(--hm8-text)!important;font-size:14px!important;line-height:1.75!important} body,.app-shell,.workspace,.page-content{background:var(--hm8-canvas)!important} body,button,input,select,textarea,.button{font-size:14px!important} small,.small,.eyebrow,.form-hint,.field-help,.panel-head p,.ds-page-header p,.page-heading p{font-size:12px!important} h1{font-size:clamp(1.45rem,2vw,1.85rem)!important}h2{font-size:1.28rem!important}h3{font-size:1.04rem!important}h4{font-size:.96rem!important}h5,h6{font-size:.9rem!important} h1,h2,h3,h4,h5,h6,.topbar-title>b{color:var(--hm8-text-strong)!important;letter-spacing:-.015em!important} a{transition:color .14s ease,background .14s ease,border-color .14s ease,box-shadow .14s ease,transform .14s ease} /* ---------- Shell / sidebar ---------- */ .app-shell{min-height:100svh!important} .app-shell .sidebar{ width:258px!important;background:#fff!important;color:var(--hm8-text)!important;border-left:1px solid var(--hm8-line)!important; box-shadow:-8px 0 28px rgba(26,44,72,.025)!important;padding:18px 13px 14px!important } .app-shell .workspace{margin-right:258px!important;min-width:0!important} .app-shell .brand{min-height:52px!important;padding:4px 7px 14px!important;border-bottom:1px solid var(--hm8-line)!important;color:var(--hm8-text)!important} .app-shell .brand-copy-inline{display:flex!important;align-items:center!important;gap:7px!important;min-width:0!important;white-space:nowrap!important} .app-shell .brand strong{color:var(--hm8-text-strong)!important;font-size:14px!important} .app-shell .brand span{color:var(--hm8-muted)!important;font-size:11px!important;margin:0!important} .app-shell .brand-separator{color:var(--hm8-gold)!important;font-size:9px!important} .app-shell .suite-overview{margin:14px 2px 12px!important;padding:13px!important;border:1px solid var(--hm8-line)!important;border-radius:16px!important;background:linear-gradient(145deg,#fff,#fafcff)!important;box-shadow:var(--hm8-shadow-xs)!important} .app-shell .suite-overview-head{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;margin-bottom:10px!important} .app-shell .suite-overview-head small{color:#53647a!important;font-size:11px!important;font-weight:900!important;opacity:1!important} .app-shell .property-year{background:var(--hm8-gold-soft)!important;border:1px solid #f0dfbb!important;color:#80632e!important;border-radius:8px!important;padding:5px 8px!important;font-size:10px!important;font-weight:850!important} .app-shell .suite-overview-list{display:grid!important;grid-template-columns:1fr 1fr!important;gap:7px!important} .app-shell .suite-overview-item{min-width:0!important;min-height:38px!important;padding:8px 9px!important;border:1px solid var(--hm8-line)!important;border-radius:10px!important;background:#fff!important;color:var(--hm8-text)!important;display:flex!important;align-items:center!important;gap:7px!important;opacity:1!important} .app-shell .suite-overview-item b{min-width:0!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;color:#33445b!important;font-size:11px!important;font-weight:850!important;opacity:1!important} .app-shell .suite-color-dot{width:8px!important;height:8px!important;flex:0 0 8px!important;border-radius:50%!important;box-shadow:0 0 0 3px rgba(111,127,147,.08)!important} .app-shell .suite-color-dot.blue{background:var(--hm8-blue)!important}.app-shell .suite-color-dot.pink{background:var(--hm8-pink)!important} .app-shell .organized-menu{gap:3px!important;padding:3px 0 8px!important} .app-shell .menu-section{position:relative!important;min-height:44px!important;padding:9px 11px!important;border:1px solid transparent!important;border-radius:11px!important;background:transparent!important;color:#4a5b70!important;font-size:13px!important;font-weight:800!important;box-shadow:none!important} .app-shell .menu-section .icon{width:19px!important;height:19px!important;color:#8493a6!important} .app-shell .menu-section:hover{background:#f7f9fc!important;color:var(--hm8-navy)!important;border-color:#eef2f7!important;transform:none!important} .app-shell .menu-section.active{background:var(--hm8-primary-soft)!important;color:#3f5eb6!important;border-color:#dbe4ff!important;box-shadow:none!important} .app-shell .menu-section.active:before{content:"";position:absolute;right:-1px;top:9px;bottom:9px;width:3px;border-radius:5px;background:var(--hm8-primary)} .app-shell .menu-section.active .icon{color:var(--hm8-primary)!important} .app-shell .menu-open-mark{margin-right:auto!important;color:#9aa7b8!important;font-weight:900!important} .app-shell .nav-count{background:var(--hm8-danger-soft)!important;color:var(--hm8-danger)!important;border:1px solid #f0cece!important} .app-shell .sidebar-install{display:flex!important;align-items:center!important;justify-content:center!important;min-height:42px!important;margin:13px 4px 4px!important;border:1px solid #d9e3f7!important;border-radius:11px!important;background:#f7f9ff!important;color:#4d67ad!important;font-weight:900!important;opacity:1!important;box-shadow:none!important} .app-shell .sidebar-install:hover{background:var(--hm8-primary-soft)!important;border-color:#c7d5f6!important;color:#3e59a7!important} .app-shell .sidebar-install[hidden]{display:none!important} .app-shell .sidebar-footer{border-top:1px solid var(--hm8-line)!important;padding-top:11px!important;background:#fff!important} .app-shell .sidebar-account{color:var(--hm8-text)!important}.app-shell .sidebar-account small{color:var(--hm8-muted)!important}.app-shell .logout-link{color:#a94f4f!important;background:transparent!important}.app-shell .logout-link:hover{background:var(--hm8-danger-soft)!important} /* ---------- Header ---------- */ .app-shell .topbar{ height:64px!important;min-height:64px!important;padding:0 22px!important;background:rgba(255,255,255,.96)!important; border-bottom:1px solid var(--hm8-line)!important;box-shadow:0 3px 18px rgba(27,45,73,.035)!important;backdrop-filter:blur(12px)!important; top:0!important } .app-shell .topbar-title b{font-size:15px!important;font-weight:950!important;color:var(--hm8-text-strong)!important} .app-shell .topbar-meta{margin-top:2px!important;gap:6px!important;color:var(--hm8-muted)!important}.app-shell .topbar-meta span,.app-shell .topbar-meta small{font-size:10px!important;color:var(--hm8-muted)!important}.app-shell .topbar-meta i{width:4px!important;height:4px!important;background:var(--hm8-gold)!important;border-radius:50%!important} .app-shell .topbar-actions{gap:7px!important} .app-shell .topbar-quick,.app-shell .icon-button.notification-bell,.app-shell .small-avatar{min-height:36px!important;height:36px!important;border:1px solid var(--hm8-line)!important;border-radius:10px!important;background:#fff!important;color:#617187!important;box-shadow:none!important} .app-shell .topbar-quick{padding:0 10px!important;gap:6px!important;font-size:11px!important;font-weight:800!important}.app-shell .topbar-quick:hover,.app-shell .icon-button.notification-bell:hover{background:var(--hm8-surface-soft)!important;border-color:var(--hm8-line-strong)!important} .app-shell .small-avatar{width:36px!important;background:var(--hm8-primary-soft)!important;color:#4966b5!important;border-color:#dbe4ff!important} /* ---------- Page frame / cards ---------- */ .app-shell .page-content{max-width:1580px!important;padding:22px clamp(18px,2.3vw,34px) 36px!important} .app-shell .panel,.app-shell .ds-card,.app-shell .section-hub-card,.app-shell .request-card,.app-shell .account-card,.app-shell .bank-card{ background:#fff!important;border:1px solid var(--hm8-line)!important;box-shadow:var(--hm8-shadow-xs)!important;border-radius:16px!important } .app-shell .panel{padding:19px!important} .app-shell .panel:hover,.app-shell .section-hub-card:hover{border-color:#d8e0ea!important;box-shadow:var(--hm8-shadow-sm)!important} .app-shell .page-heading,.app-shell .ds-page-header,.app-shell .users-heading{margin:2px 0 17px!important;padding:0 1px!important} .app-shell .page-heading .eyebrow,.app-shell .ds-page-header .eyebrow,.app-shell .eyebrow{color:#697d9b!important;letter-spacing:.02em!important;font-weight:900!important} .app-shell .page-heading h1,.app-shell .ds-page-header h1,.app-shell .users-heading h1{color:var(--hm8-text-strong)!important;margin:3px 0 5px!important} .app-shell .page-heading p,.app-shell .ds-page-header p,.app-shell .users-heading p{color:var(--hm8-muted)!important} /* restrained, AutoGallery-like hero: lively but not a large dark slab */ .app-shell .hero-panel,.app-shell .dashboard-commandbar{ color:var(--hm8-text)!important;background:linear-gradient(120deg,#f7faff 0%,#fff 56%,#f4fbf9 100%)!important; border:1px solid #dfe7f2!important;box-shadow:var(--hm8-shadow-sm)!important;border-radius:20px!important } .app-shell .hero-panel:after{background:radial-gradient(circle,rgba(102,132,213,.12),transparent 68%)!important} .app-shell .hero-panel h1,.app-shell .dashboard-commandbar h1,.app-shell .dashboard-commandbar h2{color:var(--hm8-navy)!important} .app-shell .hero-panel p,.app-shell .dashboard-commandbar p{color:var(--hm8-muted)!important} /* ---------- Controls ---------- */ .app-shell input:not([type="checkbox"]):not([type="radio"]),.app-shell select,.app-shell textarea{ background:#fff!important;color:var(--hm8-text)!important;border:1px solid var(--hm8-line-strong)!important;border-radius:11px!important;box-shadow:none!important; min-height:43px!important;padding:9px 11px!important } .app-shell textarea{min-height:94px!important} .app-shell input:focus,.app-shell select:focus,.app-shell textarea:focus{border-color:#aabbe9!important;box-shadow:var(--hm8-focus)!important;outline:none!important} .app-shell label{color:#46576d!important;font-weight:800!important} .app-shell input[type="checkbox"],.app-shell input[type="radio"]{accent-color:var(--hm8-primary)!important} .app-shell .button,.app-shell button.button{min-height:40px!important;padding:8px 14px!important;border-radius:10px!important;font-weight:850!important;box-shadow:none!important;transform:none!important} .app-shell .button.primary,.app-shell button.primary,.app-shell button.button:not(.secondary):not(.danger){background:var(--hm8-primary)!important;color:#fff!important;border:1px solid var(--hm8-primary)!important} .app-shell .button.primary:hover,.app-shell button.primary:hover,.app-shell button.button:not(.secondary):not(.danger):hover{background:var(--hm8-primary-hover)!important;border-color:var(--hm8-primary-hover)!important;box-shadow:0 7px 18px rgba(102,132,213,.16)!important} .app-shell .button.secondary,.app-shell button.secondary,.app-shell .button.soft{background:#fff!important;color:#526278!important;border:1px solid var(--hm8-line-strong)!important} .app-shell .button.secondary:hover,.app-shell button.secondary:hover,.app-shell .button.soft:hover{background:var(--hm8-surface-soft)!important;border-color:#cdd7e4!important} .app-shell .button.danger,.app-shell button.danger,.app-shell .ghost-danger,.app-shell .button-danger{background:#fff!important;color:var(--hm8-danger)!important;border:1px solid #eccccc!important} .app-shell .button.danger:hover,.app-shell button.danger:hover,.app-shell .button-danger:hover{background:var(--hm8-danger-soft)!important} .app-shell button:disabled,.app-shell .button:disabled{opacity:.5!important;cursor:not-allowed!important;box-shadow:none!important} /* ---------- Tables, states, metrics ---------- */ .app-shell .table-wrap{background:#fff!important;border:1px solid var(--hm8-line)!important;border-radius:14px!important;box-shadow:none!important;overflow:auto!important} .app-shell table{background:#fff!important}.app-shell thead th{background:#f8fafc!important;color:#65768a!important;border-bottom:1px solid var(--hm8-line)!important;font-size:11px!important}.app-shell tbody td{color:#33445b!important;border-bottom:1px solid #eef2f6!important;font-size:12px!important}.app-shell tbody tr:hover td{background:#fbfcfe!important} .app-shell .status-chip,.app-shell .ds-badge{border:1px solid #e1e7ef!important;background:#f7f9fc!important;color:#5d6d81!important} .app-shell .status-chip.active,.app-shell .status-chip.approved,.app-shell .status-chip.allocated{background:var(--hm8-success-soft)!important;color:var(--hm8-success)!important;border-color:#d1e9e1!important} .app-shell .stat-card{background:#fff!important;border:1px solid var(--hm8-line)!important;border-radius:15px!important;box-shadow:var(--hm8-shadow-xs)!important} .app-shell .stat-card strong{color:var(--hm8-navy)!important}.app-shell .stat-card span,.app-shell .stat-card small{color:var(--hm8-muted)!important} .app-shell .stat-icon{border-radius:12px!important}.app-shell .stat-icon.teal{background:var(--hm8-teal-soft)!important;color:var(--hm8-teal)!important}.app-shell .stat-icon.blue{background:var(--hm8-blue-soft)!important;color:#568eb0!important}.app-shell .stat-icon.amber{background:var(--hm8-gold-soft)!important;color:#9a7434!important}.app-shell .stat-icon.violet{background:#f3f0ff!important;color:#7867b4!important} .app-shell .flash{box-shadow:none!important;border-width:1px!important}.app-shell .flash.success{background:var(--hm8-success-soft)!important;border-color:#d2ebe2!important;color:#2d735f!important}.app-shell .flash.danger{background:var(--hm8-danger-soft)!important;border-color:#efd3d3!important;color:#a95151!important} /* ---------- Section hub cards: add life through soft icon tones, not heavy backgrounds ---------- */ .app-shell .section-hub-card{min-height:122px!important;padding:17px!important;color:var(--hm8-text)!important} .app-shell .section-hub-card-icon{background:var(--hm8-primary-soft)!important;color:#5c75c3!important;border:1px solid #e0e7fb!important;border-radius:13px!important} .app-shell .section-hub-card:nth-child(3n+2) .section-hub-card-icon{background:var(--hm8-teal-soft)!important;color:var(--hm8-teal)!important;border-color:#dbeee9!important} .app-shell .section-hub-card:nth-child(3n) .section-hub-card-icon{background:var(--hm8-gold-soft)!important;color:#977438!important;border-color:#f1e3c6!important} .app-shell .section-hub-card h2,.app-shell .section-hub-card h3{color:var(--hm8-navy)!important}.app-shell .section-hub-card p{color:var(--hm8-muted)!important} /* ---------- Main calendar ---------- */ #main-content .professional-calendar .calendar-command-center{background:#fff!important;border:1px solid var(--hm8-line)!important;border-radius:17px!important;box-shadow:var(--hm8-shadow-xs)!important} #main-content .professional-calendar .calendar-title-row h1{color:var(--hm8-navy)!important} #main-content .professional-calendar .calendar-command-heading p{color:var(--hm8-muted)!important} #main-content .professional-calendar .calendar-cache-status{background:var(--hm8-teal-soft)!important;color:#3b756a!important;border-color:#d8ebe7!important} #main-content .professional-calendar .calendar-nav-button,#main-content .professional-calendar .calendar-today,#main-content .professional-calendar .calendar-settings-link{background:#fff!important;color:#55657a!important;border:1px solid var(--hm8-line)!important;box-shadow:none!important} #main-content .professional-calendar .calendar-nav-button:hover,#main-content .professional-calendar .calendar-today:hover{background:var(--hm8-surface-soft)!important} #main-content .professional-calendar .calendar-view-tabs{background:#f6f8fb!important;border:1px solid #edf1f5!important} #main-content .professional-calendar .calendar-view-tabs a{color:#77869a!important}.professional-calendar .calendar-view-tabs a.active{background:#fff!important;color:#4d68b8!important;box-shadow:0 2px 8px rgba(30,48,78,.08)!important;border:1px solid #e1e7f2!important} #main-content .professional-calendar .calendar-filter-panel{background:#fbfcfe!important;border-color:var(--hm8-line)!important} #main-content .professional-calendar .calendar-board{border:1px solid var(--hm8-line)!important;border-radius:16px!important;background:#fff!important;box-shadow:var(--hm8-shadow-xs)!important} #main-content .professional-calendar .calendar-week-head{background:#f8fafc!important;border-bottom:1px solid var(--hm8-line)!important;color:#78879a!important} #main-content .professional-calendar .calendar-grid button.calendar-day{background:#fff!important;color:#34465d!important;border-color:#e9edf3!important;box-shadow:none!important} #main-content .professional-calendar .calendar-grid button.calendar-day:hover{background:#fafcff!important;box-shadow:inset 0 0 0 1px #d9e2ed!important} #main-content .professional-calendar .calendar-grid button.calendar-day.today{background:#f8faff!important;box-shadow:inset 0 0 0 2px #becbf1!important} #main-content .professional-calendar .calendar-grid button.calendar-day.holiday{background:#fffdfd!important} #main-content .professional-calendar .calendar-grid .calendar-day.empty{background:#fafbfc!important} #main-content .professional-calendar .calendar-day-number{color:#34465d!important}.professional-calendar .holiday-mark{background:#fff1f1!important;color:#b45a5a!important;border:1px solid #f2d3d3!important} #main-content .professional-calendar .day-item{background:#f7f9fc!important;border-color:#e6ebf1!important;color:#536479!important}.professional-calendar .day-item.occasion{background:var(--hm8-gold-soft)!important;border-color:#f0e0c1!important}.professional-calendar .day-item.period.blue{background:var(--hm8-blue-soft)!important;border-color:#d6eaf5!important}.professional-calendar .day-item.period.pink{background:var(--hm8-pink-soft)!important;border-color:#f1dce5!important}.professional-calendar .day-item.event{background:#f3f0ff!important;border-color:#e4def7!important} /* ---------- Hotel-style booking: explicit state machine, immune to generic button rules ---------- */ #periodModal .booking-dialog{background:#fff!important;border:1px solid #dfe5ed!important;box-shadow:0 28px 80px rgba(24,42,69,.18)!important} #periodModal .booking-dialog-head{background:#fff!important;border-bottom:1px solid var(--hm8-line)!important} #periodModal .booking-heading h2{color:var(--hm8-navy)!important}#periodModal .booking-heading p{color:var(--hm8-muted)!important} #periodModal .booking-close{background:#fff!important;color:#607188!important;border:1px solid var(--hm8-line)!important} #periodModal .booking-close:hover{background:#f7f9fc!important;color:#33465f!important} #periodModal .booking-step-no{background:var(--hm8-primary-soft)!important;color:#536fbd!important} #periodModal .booking-step-head h3{color:var(--hm8-navy)!important}#periodModal .booking-step-head p{color:var(--hm8-muted)!important} #periodModal .booking-suite-card{background:#fff!important;border-color:var(--hm8-line)!important;box-shadow:none!important} #periodModal .booking-suite-card:hover{background:#fbfcfe!important;border-color:#d1dbe8!important} #periodModal .booking-suite-card:has(input:checked){background:#f8faff!important;border-color:#b9c7ee!important;box-shadow:0 0 0 3px rgba(102,132,213,.08)!important} #periodModal .booking-suite-card.blue:has(input:checked){background:#f4fbff!important;border-color:#c5e2f1!important}#periodModal .booking-suite-card.pink:has(input:checked){background:#fff6f9!important;border-color:#edcfdb!important} #periodModal .booking-suite-check{background:#f0f3f7!important;color:transparent!important}#periodModal .booking-suite-card:has(input:checked) .booking-suite-check{background:var(--hm8-primary)!important;color:#fff!important} #periodModal .booking-calendar-shell{background:#fff!important;border:1px solid var(--hm8-line)!important;border-radius:15px!important;box-shadow:none!important} #periodModal .booking-calendar-toolbar{background:#fbfcfe!important;border-bottom:1px solid var(--hm8-line)!important} #periodModal .booking-month-nav{background:#fff!important;color:#566a87!important;border:1px solid var(--hm8-line)!important;box-shadow:none!important} #periodModal .booking-month-nav:hover{background:var(--hm8-primary-softer)!important;color:#4865b6!important;border-color:#cfdaef!important} #periodModal .booking-weekdays{background:#fff!important;color:#8492a5!important} /* FREE = WHITE. These ID based selectors intentionally outrank every legacy global button selector. */ #periodModal #bookingDateGrid>button.booking-date, #periodModal #bookingDateGrid>button.booking-date.free{ appearance:none!important;background:#fff!important;color:#34465d!important;border:1px solid #e0e6ee!important; box-shadow:none!important;border-radius:10px!important;opacity:1!important;transform:none!important;cursor:pointer!important } #periodModal #bookingDateGrid>button.booking-date:not(.busy):not(.checkin):not(.checkout):not(.in-range):hover{ background:#f8faff!important;border-color:#bdc9e8!important;color:#2f4260!important;box-shadow:0 4px 12px rgba(41,64,101,.06)!important } #periodModal #bookingDateGrid>button.booking-date i{color:#98a4b3!important;font-weight:750!important} #periodModal #bookingDateGrid>button.booking-date.today:not(.checkin):not(.checkout):not(.in-range){background:#fff!important;border-color:#9fb0dd!important;box-shadow:inset 0 0 0 1px #c8d2ed!important} /* SELECTED range = pale, endpoints = clearly selected but intentionally light */ #periodModal #bookingDateGrid>button.booking-date.in-range{ background:#edf2ff!important;color:#405ba8!important;border-color:#ced9f6!important;box-shadow:none!important;border-radius:8px!important } #periodModal #bookingDateGrid>button.booking-date.checkin, #periodModal #bookingDateGrid>button.booking-date.checkout{ background:#6f8bd7!important;color:#fff!important;border-color:#6f8bd7!important;box-shadow:0 5px 14px rgba(84,113,190,.18)!important;border-radius:10px!important } #periodModal #bookingDateGrid>button.booking-date.checkin i, #periodModal #bookingDateGrid>button.booking-date.checkout i{color:#eef3ff!important} #periodModal #bookingDateGrid>button.booking-date.in-range i{color:#7083bb!important} /* BUSY = neutral grey; never looks selected */ #periodModal #bookingDateGrid>button.booking-date.busy:not(.checkin):not(.checkout){ background:#f3f5f7!important;color:#9aa5b3!important;border-color:#e7ebef!important;box-shadow:none!important;opacity:1!important } #periodModal #bookingDateGrid>button.booking-date.busy:not(.checkin):not(.checkout) i{color:#a7afb9!important} #periodModal .booking-calendar-legend{background:#fbfcfe!important;border-top:1px solid var(--hm8-line)!important;color:#748398!important} #periodModal .booking-calendar-legend .free{background:#fff!important;border:1px solid #dce3eb!important}#periodModal .booking-calendar-legend .selected{background:#dfe8fb!important;border:1px solid #b4c3e8!important}#periodModal .booking-calendar-legend .busy{background:#eef1f4!important;border:1px solid #e0e5ea!important} #periodModal .booking-date-summary>div:not(.booking-night-count){background:#fff!important;border-color:var(--hm8-line)!important}#periodModal .booking-night-count{background:var(--hm8-primary-soft)!important;color:#4c66af!important} #periodModal .booking-summary-card{background:linear-gradient(180deg,#fbfcff,#f8fafc)!important;border-color:var(--hm8-line)!important;color:var(--hm8-text)!important} #periodModal .booking-summary-icon{background:#fff!important;color:#5d76bf!important;border-color:#e0e6ef!important} #periodModal .booking-summary-card h3{color:var(--hm8-navy)!important}#periodModal .booking-summary-card dt{color:#8794a5!important}#periodModal .booking-summary-card dd{color:#3f5068!important} #periodModal .booking-summary-status.ready{background:var(--hm8-success-soft)!important;color:#367663!important;border-color:#d2e8e1!important} #periodModal #periodOwnerResults .owner-result{background:#fff!important;color:#33455d!important;border-color:#edf1f5!important}#periodModal #periodOwnerResults .owner-result:hover{background:#f8faff!important} /* ---------- Drawer / modal surfaces ---------- */ .app-shell .calendar-day-panel,.app-shell .calendar-form-modal,.app-shell .calendar-workflow-drawer,.app-shell dialog,.app-shell .modal-card{background:#fff!important;color:var(--hm8-text)!important;border-color:var(--hm8-line)!important;box-shadow:var(--hm8-shadow-md)!important} .app-shell .calendar-panel-close,.app-shell .modal-close{background:#fff!important;color:#64758b!important;border:1px solid var(--hm8-line)!important;box-shadow:none!important} .calendar-overlay,.booking-overlay{background:rgba(35,48,67,.34)!important;backdrop-filter:blur(4px)!important} /* ---------- Mobile ---------- */ @media(max-width:980px){ .app-shell .sidebar{width:min(286px,86vw)!important;box-shadow:-16px 0 45px rgba(17,34,58,.14)!important} .app-shell .workspace{margin-right:0!important} .app-shell .page-content{padding:15px 13px 88px!important} .app-shell .topbar{height:58px!important;min-height:58px!important;padding:0 12px!important} .app-shell .topbar-quick span{display:none!important}.app-shell .topbar-quick{width:36px!important;padding:0!important;justify-content:center!important} .app-shell .panel{padding:15px!important;border-radius:14px!important} } @media(max-width:760px){ body{font-size:13.5px!important} .app-shell .mobile-dock{background:rgba(255,255,255,.97)!important;border-top:1px solid var(--hm8-line)!important;box-shadow:0 -8px 24px rgba(28,46,74,.055)!important} .app-shell .mobile-dock a,.app-shell .mobile-dock button{color:#738298!important;background:transparent!important}.app-shell .mobile-dock a.active{background:var(--hm8-primary-soft)!important;color:#506bb8!important} #periodModal .booking-dialog{border-radius:20px 20px 0 0!important} #periodModal .booking-summary-card{background:#fafcff!important;border-color:var(--hm8-line)!important} #periodModal #bookingDateGrid>button.booking-date{min-height:42px!important;padding:4px 1px!important;border-radius:8px!important} #periodModal #bookingDateGrid>button.booking-date span{font-size:.69rem!important} } @media(max-width:480px){ .app-shell .suite-overview-list{grid-template-columns:1fr 1fr!important} .app-shell .page-content{padding-inline:10px!important} #periodModal #bookingDateGrid{gap:3px!important;padding-inline:5px!important} #periodModal #bookingDateGrid>button.booking-date{min-height:40px!important} } /* ---------- Reduced motion / accessibility ---------- */ @media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation-duration:.01ms!important}} :focus-visible{outline:2px solid rgba(102,132,213,.55)!important;outline-offset:2px!important} /* ========================================================================== */ /* Hammelk v9 — readability, explicit allocation state and calendar policies */ /* ========================================================================== */ :root{ --hm9-disabled-bg:#e8eef9; --hm9-disabled-text:#536681; --hm9-placeholder:#8795a8; } /* Central contrast policy: controls must stay readable in every state. */ .app-shell :is(input,textarea,select)::placeholder{color:var(--hm9-placeholder)!important;opacity:1!important} .app-shell :is(input,textarea,select):disabled{background:#f4f6f9!important;color:#68778b!important;border-color:#dfe5ed!important;opacity:1!important} .app-shell :is(button,.button):disabled, .app-shell :is(button,.button)[aria-disabled="true"]{opacity:1!important;cursor:not-allowed!important;box-shadow:none!important} .app-shell :is(button.primary,.button.primary):disabled, #periodModal .booking-submit:disabled{background:var(--hm9-disabled-bg)!important;border-color:#d7e0f1!important;color:var(--hm9-disabled-text)!important} #periodModal .booking-submit small{color:rgba(255,255,255,.9)!important;opacity:1!important} #periodModal .booking-submit:disabled small{color:#71809a!important;opacity:1!important} .app-shell .field-help,.app-shell .form-hint,.app-shell .settings-field small,.app-shell .panel-head p{color:#718095!important;opacity:1!important} .app-shell .status-chip,.app-shell .badge,.app-shell .eyebrow{opacity:1!important} /* Free booking is a booking state, never a fake owner/person. */ #periodModal .booking-unassigned-option{display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;align-items:center;padding:12px 13px;margin-bottom:10px;border:1px solid #dfe6ef;border-radius:13px;background:#fbfcfe;cursor:pointer;transition:.15s ease} #periodModal .booking-unassigned-option:hover{border-color:#cdd8e8;background:#f8faff} #periodModal .booking-unassigned-option input{position:absolute;width:1px!important;height:1px!important;opacity:0;pointer-events:none} #periodModal .booking-unassigned-check{width:26px;height:26px;display:grid;place-items:center;border-radius:8px;border:1px solid #cfd9e7;background:#fff;color:transparent;font-weight:950} #periodModal .booking-unassigned-option input:checked+.booking-unassigned-check{background:#6f86bf;border-color:#6f86bf;color:#fff} #periodModal .booking-unassigned-option>span:last-child{display:grid;gap:2px} #periodModal .booking-unassigned-option b{color:#31445e;font-size:12px} #periodModal .booking-unassigned-option small{color:#7b899c;font-size:9.5px!important;line-height:1.65} #periodModal .booking-owner-assignment{padding:11px 12px;border:1px solid #e4e9f0;border-radius:13px;background:#fff;transition:.15s ease} #periodModal .booking-owner-assignment.is-disabled{background:#f7f9fb;border-style:dashed} #periodModal .booking-owner-assignment.is-disabled .owner-smart-picker{opacity:.55;pointer-events:none} #periodModal .owner-assignment-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px} #periodModal .owner-assignment-head b{color:#415269;font-size:11px} #periodModal .owner-assignment-head small{color:#8793a3;font-size:9px!important} /* Calendar settings: category visibility + priority. */ .occasion-policy-box{margin-top:14px;padding:14px;border:1px solid var(--hm8-line);border-radius:14px;background:#fff} .occasion-policy-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px} .occasion-policy-head>div{display:grid;gap:3px}.occasion-policy-head b{color:#31445e;font-size:12px}.occasion-policy-head>small{color:#7e8b9c;font-size:9px!important;max-width:160px;line-height:1.7} .occasion-policy-list{display:grid;gap:7px}.occasion-policy-row{display:grid;grid-template-columns:minmax(0,1fr) 92px;gap:9px;align-items:center;padding:9px 10px;border:1px solid #edf0f4;border-radius:11px;background:#fbfcfe} .occasion-show-toggle{display:flex;align-items:center;gap:8px;cursor:pointer}.occasion-show-toggle>input{position:absolute;width:1px!important;height:1px!important;opacity:0}.occasion-show-toggle>input:checked+.calendar-switch{background:var(--hm-primary,#5577d9)!important;box-shadow:0 0 0 3px rgba(85,119,217,.12)}.occasion-show-toggle>input:checked+.calendar-switch i{transform:translateX(-20px)!important}.occasion-show-toggle>input:focus-visible+.calendar-switch{outline:3px solid rgba(85,119,217,.2);outline-offset:2px}.occasion-show-toggle>input:not(:checked)+.calendar-switch{background:#d8dee8!important}.occasion-show-toggle>span:last-child{display:grid;gap:1px}.occasion-show-toggle b{font-size:10.5px;color:#3b4e66}.occasion-show-toggle small{font-size:8.5px!important;color:#8793a3;line-height:1.55} .occasion-priority{display:grid!important;grid-template-columns:auto 46px;align-items:center;gap:6px}.occasion-priority>span{font-size:9px!important;color:#7c8999;margin:0!important}.occasion-priority select{height:34px!important;min-height:34px!important;padding:0 7px!important;border-radius:8px!important;background:#fff!important} .occasion-policy-note{margin:10px 0 0;padding:8px 9px;border-radius:9px;background:#f7f9fc;color:#68778b;font-size:9px!important;line-height:1.75} @media(max-width:760px){ #periodModal .owner-assignment-head{display:grid;gap:2px} .occasion-policy-head{display:grid}.occasion-policy-head>small{max-width:none} .occasion-policy-row{grid-template-columns:1fr 82px;padding:8px} } @media(max-width:480px){.occasion-policy-row{grid-template-columns:1fr}.occasion-priority{grid-template-columns:1fr 58px}} .app-shell :is(button,.button) small{opacity:1!important} .app-shell :is(button,.button):disabled :is(span,small,b){opacity:1!important;color:inherit!important} /* ShareHome v8.1: menu refinement pack (sidebar clarity, suite labels, richer states) */ .app-shell .sidebar{padding:18px 14px 16px!important} .app-shell .brand{padding:6px 8px 16px!important} .app-shell .brand-copy-inline{gap:8px!important;flex-wrap:wrap!important} .app-shell .brand strong{font-size:15px!important} .app-shell .brand span{font-size:11px!important} .app-shell .suite-overview{padding:14px!important;border-radius:18px!important;background:linear-gradient(180deg,#ffffff 0%,#fbfcff 100%)!important;box-shadow:0 10px 24px rgba(31,47,70,.05)!important} .app-shell .suite-overview-head{margin-bottom:12px!important} .app-shell .suite-overview-head small{font-size:11px!important} .app-shell .suite-overview-list{grid-template-columns:1fr!important;gap:8px!important} .app-shell .suite-overview-item{min-height:44px!important;padding:10px 12px!important;border-radius:13px!important;background:linear-gradient(180deg,#ffffff 0%,#f9fbff 100%)!important;box-shadow:0 2px 8px rgba(31,47,70,.025)!important;align-items:flex-start!important} .app-shell .suite-overview-item b{white-space:normal!important;overflow:visible!important;text-overflow:clip!important;display:block!important;font-size:12px!important;line-height:1.55!important} .app-shell .suite-overview-item:nth-child(1){border-color:#dbe7fb!important;background:linear-gradient(180deg,#ffffff 0%,#f6f9ff 100%)!important} .app-shell .suite-overview-item:nth-child(2){border-color:#f1d7e3!important;background:linear-gradient(180deg,#ffffff 0%,#fff7fb 100%)!important} .app-shell .suite-color-dot{margin-top:5px!important;box-shadow:0 0 0 4px rgba(111,127,147,.08)!important} .app-shell .organized-menu{gap:7px!important;padding:6px 0 10px!important} .app-shell .menu-section{ min-height:52px!important; padding:11px 13px!important; border-radius:16px!important; border:1px solid #edf2fa!important; background:linear-gradient(180deg,#ffffff 0%,#fbfcff 100%)!important; color:#44546a!important; box-shadow:0 2px 8px rgba(31,47,70,.02)!important; transition:background .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease,color .18s ease!important; } .app-shell .menu-section .icon{width:20px!important;height:20px!important;color:#7f90a7!important;transition:color .18s ease,transform .18s ease!important} .app-shell .menu-section>span:not(.menu-open-mark):not(.nav-count){font-size:13px!important;font-weight:850!important;line-height:1.5!important} .app-shell .menu-open-mark{color:#a3afbf!important;font-size:22px!important;transition:transform .18s ease,color .18s ease!important} .app-shell .menu-section:hover{ background:linear-gradient(180deg,#fbfcff 0%,#f4f8ff 100%)!important; border-color:#dbe6fb!important; color:#22395e!important; box-shadow:0 12px 28px rgba(102,132,213,.08)!important; transform:translateX(-4px)!important; } .app-shell .menu-section:hover .icon{color:#5876cd!important;transform:scale(1.05)!important} .app-shell .menu-section:hover .menu-open-mark{color:#5876cd!important;transform:translateX(-3px)!important} .app-shell .menu-section.active{ background:linear-gradient(90deg,#eef3ff 0%,#f7f9ff 100%)!important; border-color:#cfdcff!important; color:#3354b0!important; box-shadow:0 12px 26px rgba(102,132,213,.12)!important; } .app-shell .menu-section.active:before{right:-1px!important;top:8px!important;bottom:8px!important;width:4px!important;border-radius:999px!important;background:linear-gradient(180deg,#6b89dc 0%,#5574ca 100%)!important} .app-shell .menu-section.active .icon,.app-shell .menu-section.active .menu-open-mark{color:#4d6fd0!important} .app-shell .menu-home{margin-bottom:2px!important} .app-shell .menu-home.active{background:linear-gradient(90deg,#edf8f5 0%,#f8fdfb 100%)!important;border-color:#cfe8df!important;color:#236252!important;box-shadow:0 10px 24px rgba(75,143,132,.10)!important} .app-shell .menu-home.active .icon{color:#2c7a69!important} .app-shell .nav-count{min-width:22px!important;height:22px!important;padding:0 6px!important;border-radius:999px!important;font-size:11px!important;font-weight:900!important} .app-shell .sidebar-install{display:flex!important;align-items:center!important;justify-content:center!important;min-height:44px!important;margin:14px 4px 4px!important;padding:0 12px!important;border:1px solid #e1d4b9!important;border-radius:14px!important;background:linear-gradient(180deg,#fffaf2 0%,#fff5e7 100%)!important;color:#946e27!important;font-weight:900!important;box-shadow:0 6px 18px rgba(201,164,92,.10)!important} .app-shell .sidebar-install:hover{background:linear-gradient(180deg,#fff6e8 0%,#fff0db 100%)!important;border-color:#d7bc84!important;color:#7d5d1d!important} .app-shell .sidebar-account{padding:10px!important;border-radius:15px!important;transition:background .16s ease,border-color .16s ease,transform .16s ease,box-shadow .16s ease!important;border:1px solid transparent!important} .app-shell .sidebar-account:hover{background:#f8fbff!important;border-color:#e1eaf8!important;box-shadow:0 10px 22px rgba(31,47,70,.05)!important;transform:translateY(-1px)!important} .app-shell .logout-link{min-height:46px!important;border:1px solid transparent!important;border-radius:14px!important;padding:10px 12px!important} .app-shell .logout-link:hover{border-color:#f4d4d4!important;box-shadow:0 10px 22px rgba(189,93,93,.08)!important} @media (max-width:1160px){ .app-shell .suite-overview-list{grid-template-columns:1fr!important} } @media (max-width:900px){ .app-shell .menu-section{min-height:50px!important;padding:10px 12px!important;border-radius:15px!important} } /* ShareHome v8.2: full sidebar labels — never hide navigation text behind ellipsis. */ @media (min-width:981px){ .app-shell .sidebar{width:270px!important} .app-shell .workspace{margin-right:270px!important} } .app-shell .sidebar-nav.organized-menu .menu-section{ height:auto!important; overflow:visible!important; } .app-shell .sidebar-nav.organized-menu .menu-section > span:not(.menu-open-mark):not(.nav-count){ width:auto!important; min-width:0!important; max-width:none!important; flex:1 1 auto!important; white-space:normal!important; overflow:visible!important; text-overflow:clip!important; text-align:right!important; word-break:normal!important; overflow-wrap:normal!important; } .app-shell .sidebar-nav.organized-menu .menu-section > .menu-open-mark{ width:auto!important; flex:0 0 18px!important; text-align:center!important; } .app-shell .sidebar-nav.organized-menu .menu-section > .nav-count{ width:auto!important; flex:0 0 auto!important; } @media (max-width:980px){ .app-shell .sidebar-nav.organized-menu .menu-section > span:not(.menu-open-mark):not(.nav-count){ white-space:normal!important; overflow:visible!important; text-overflow:clip!important; } } /* ===== hammelk-v11.css ===== */ /* Hammelk v11 — central UX refinement layer One authority for lists, feedback, reports, stays, dashboard and mobile readability. */ :root{ --v11-text:#203047;--v11-muted:#627287;--v11-line:#dfe7f1;--v11-soft:#f7f9fc; --v11-primary:#5d7ed3;--v11-primary-soft:#eef3ff;--v11-success:#3c806d;--v11-danger:#b85454; --v11-warning:#956f2e;--v11-shadow:0 14px 34px rgba(31,47,70,.07); } /* readable small copy everywhere */ .app-shell small,.app-shell .small,.app-shell .muted,.app-shell .form-hint,.app-shell .field-help, .app-shell .panel-head p,.app-shell label>small,.app-shell .eyebrow,.login-v4 small{ font-weight:650!important;color:var(--v11-muted)!important;text-rendering:optimizeLegibility; } .app-shell .eyebrow{font-weight:850!important}.app-shell .field-error{font-size:12px!important;font-weight:800!important;color:#a94141!important;line-height:1.7!important} .app-shell input::placeholder,.app-shell textarea::placeholder{color:#8795a7!important;font-weight:600!important} /* transient messages */ .toast-stack{position:fixed;z-index:100500;top:18px;left:18px;display:grid;gap:10px;width:min(420px,calc(100vw - 36px));pointer-events:none} .ds-toast{pointer-events:auto;display:grid;grid-template-columns:30px 1fr 30px;align-items:center;gap:10px;padding:13px 14px;border:1px solid var(--v11-line);border-radius:16px;background:rgba(255,255,255,.98);box-shadow:0 20px 55px rgba(24,39,62,.16);color:var(--v11-text);animation:v11ToastIn .18s ease both} .ds-toast.success{border-color:#cce5dc;background:#f8fdfb}.ds-toast.danger{border-color:#efd0d0;background:#fffafa}.ds-toast.warning{border-color:#ecdcb8;background:#fffdf7}.ds-toast.info{border-color:#d9e2f5;background:#fbfcff} .ds-toast .toast-symbol{width:28px;height:28px;display:grid;place-items:center;border-radius:9px;background:var(--v11-primary-soft);font-weight:900}.ds-toast.success .toast-symbol{background:#e8f6f1;color:var(--v11-success)}.ds-toast.danger .toast-symbol{background:#fff0f0;color:var(--v11-danger)}.ds-toast.warning .toast-symbol{background:#fff6e5;color:var(--v11-warning)} .ds-toast .toast-copy{font-size:13px;font-weight:750;line-height:1.75}.ds-toast [data-toast-close]{border:0!important;background:transparent!important;color:#8793a4!important;box-shadow:none!important;font-size:21px!important;padding:0!important;min-height:30px!important;cursor:pointer}.ds-toast.is-leaving{opacity:0;transform:translateY(-6px);transition:.18s ease} @keyframes v11ToastIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}} .context-alert{padding:12px 14px;border:1px solid #dfe7f1;border-radius:14px;background:#f8fafc;color:#536276;font-weight:750;margin:0 0 14px}.context-alert.danger{background:#fff8f8;border-color:#efd0d0;color:#954848} /* Central select/list component */ .ds-native-select{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important;clip-path:inset(50%)!important} .ds-select{position:relative;width:100%;min-width:0}.ds-select-trigger{width:100%!important;min-height:45px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;padding:9px 12px!important;border:1px solid #dce4ee!important;border-radius:12px!important;background:#fff!important;color:#26364d!important;box-shadow:0 1px 0 rgba(31,47,70,.02)!important;text-align:right!important;font-size:14px!important;font-weight:700!important;cursor:pointer!important} .ds-select-trigger:hover{border-color:#cbd7e8!important;background:#fbfcff!important}.ds-select.open .ds-select-trigger,.ds-select-trigger:focus-visible{border-color:#9db1e9!important;box-shadow:0 0 0 4px rgba(93,126,211,.12)!important;outline:0!important}.ds-select-trigger i{font-style:normal;color:#8492a6;font-size:17px;transition:transform .15s}.ds-select.open .ds-select-trigger i{transform:rotate(180deg)} .ds-select-menu{position:absolute;z-index:5000;top:calc(100% + 6px);right:0;left:0;padding:7px;border:1px solid #dce5f0;border-radius:14px;background:#fff;box-shadow:0 18px 46px rgba(31,47,70,.15);max-height:320px;overflow:hidden}.ds-select-menu[hidden]{display:none!important}.ds-select-search{padding:3px 3px 7px}.ds-select-search input{min-height:40px!important;padding:8px 10px!important;border-radius:10px!important;background:#f8fafc!important;font-size:13px!important}.ds-select-options{max-height:250px;overflow:auto;display:grid;gap:3px;scrollbar-width:thin;scrollbar-color:#c5d1df transparent}.ds-select-option{width:100%!important;min-height:40px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;border:0!important;border-radius:10px!important;background:#fff!important;color:#33455d!important;padding:8px 10px!important;box-shadow:none!important;text-align:right!important;font-size:13px!important;font-weight:700!important;cursor:pointer!important}.ds-select-option:hover,.ds-select-option.active{background:#f1f5ff!important;color:#3656ad!important}.ds-select-option[aria-selected="true"]{background:#eef3ff!important;color:#3656ad!important;font-weight:850!important}.ds-select-option i{font-style:normal;color:#5476ce}.ds-select-option[hidden]{display:none!important}.ds-select-option:disabled{opacity:.45;cursor:not-allowed!important}.ds-select.is-disabled{opacity:.6} /* custom suggestion lists should look the same */ .bank-suggestions,.owner-results{border:1px solid #dce5f0!important;border-radius:14px!important;background:#fff!important;box-shadow:0 18px 46px rgba(31,47,70,.15)!important;padding:7px!important}.bank-suggestions button,.owner-result{min-height:40px!important;border-radius:10px!important;background:#fff!important;color:#33455d!important;font-weight:700!important}.bank-suggestions button:hover,.bank-suggestions button:focus,.bank-suggestions button.is-active,.owner-result:hover,.owner-result:focus,.owner-result.active{background:#f1f5ff!important;color:#3656ad!important;outline:0!important} /* history report */ .report-page-head{margin-bottom:14px}.usage-summary-card{display:grid;grid-template-columns:230px 1fr;gap:18px;padding:18px;margin-bottom:14px;border:1px solid var(--v11-line);border-radius:20px;background:linear-gradient(135deg,#fff,#f8fbff);box-shadow:var(--v11-shadow)}.usage-summary-main{display:grid;align-content:center;gap:5px;padding:4px 12px;border-left:1px solid var(--v11-line)}.usage-summary-main span{font-size:12px;font-weight:750;color:var(--v11-muted)}.usage-summary-main strong{font-size:28px;color:#304c91}.usage-summary-main small{font-size:12px}.season-rights-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.season-right{padding:11px;border:1px solid #e5ebf3;border-radius:14px;background:#fff;display:grid;gap:3px}.season-right span{font-size:12px;font-weight:800}.season-right b{font-size:12px}.season-right small{font-size:11px}.season-right.open{background:#f4fbf8;border-color:#d3e9e0}.season-right.open b{color:#33725f}.season-right.done{background:#f8f9fc;color:#6c788a} .report-tabs{display:flex;gap:7px;overflow:auto;padding:3px 1px 10px;margin-bottom:4px}.report-tabs a{flex:0 0 auto;display:flex;align-items:center;gap:7px;padding:9px 12px;border:1px solid #e2e8f1;border-radius:12px;background:#fff;color:#536276;text-decoration:none;font-size:12px;font-weight:800}.report-tabs a b{min-width:22px;height:22px;display:grid;place-items:center;border-radius:999px;background:#f1f4f8;font-size:11px}.report-tabs a.active{background:var(--v11-primary-soft);border-color:#ccd9fb;color:#3656ad}.report-tabs a.active b{background:#fff;color:#3656ad} .report-filter-panel{margin-bottom:14px}.report-filter-toggle{display:none!important}.report-filters{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:9px;padding:12px;border:1px solid var(--v11-line);border-radius:16px;background:#fafbfe}.report-filters label{display:grid;gap:5px;font-size:11px;font-weight:750;color:#617087}.report-filter-actions{display:flex;align-items:end;gap:7px}.report-list-panel{padding:18px!important}.history-card-list{display:grid;gap:10px}.history-record{border:1px solid #e3e9f1;border-radius:17px;background:#fff;overflow:hidden}.history-record.used{border-right:4px solid #65a38f}.history-record.upcoming{border-right:4px solid #6f8fd9}.history-record.cancelled{border-right:4px solid #cf7474;opacity:.86}.history-record.unresolved{border-right:4px solid #c49b51}.history-record-main{display:grid;grid-template-columns:minmax(230px,1fr) minmax(420px,1.8fr);gap:18px;align-items:center;padding:14px 16px}.history-record-title{display:flex;align-items:center;gap:10px}.history-record-title h3{margin:0 0 3px!important;font-size:14px!important}.history-record-title p{margin:0;color:var(--v11-muted);font-size:12px;font-weight:650}.history-state{flex:0 0 auto;padding:5px 8px;border-radius:999px;font-size:10px;font-weight:850;background:#f2f4f8;color:#59687b}.history-state.used{background:#eaf7f2;color:#31705d}.history-state.upcoming{background:#eef3ff;color:#4260b4}.history-state.cancelled{background:#fff0f0;color:#a14b4b}.history-state.unresolved{background:#fff7e8;color:#8e6a2b}.history-record-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.history-record-facts span{display:grid;gap:2px;padding:8px 9px;border-radius:10px;background:#f8fafc}.history-record-facts small{font-size:10px!important}.history-record-facts b{font-size:11px;white-space:normal}.history-details{border-top:1px solid #edf1f6}.history-details summary{padding:9px 16px;cursor:pointer;color:#4f67a2;font-size:11px;font-weight:800}.history-detail-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:0 16px 14px}.history-detail-grid>div{display:grid;gap:3px;padding:8px 10px;border:1px solid #edf1f6;border-radius:10px}.history-detail-grid span{font-size:10px;color:var(--v11-muted);font-weight:700}.history-detail-grid b{font-size:11px}.history-detail-grid .span-2{grid-column:span 2} /* stay workflow */ .stay-workflow{padding:20px!important}.stay-workflow-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:16px}.stay-workflow-head h2{margin:2px 0 4px!important}.stay-workflow-head p{margin:0;color:var(--v11-muted)}.stay-rate-card{flex:0 0 auto;display:grid;gap:2px;padding:10px 13px;border:1px solid #dfe8f4;border-radius:14px;background:#f8fbff}.stay-rate-card span{font-size:10px;color:var(--v11-muted);font-weight:750}.stay-rate-card b{font-size:11px;color:#3e5374}.stay-step-form{display:grid;gap:10px}.stay-step{display:grid;grid-template-columns:38px 1fr;gap:12px;padding:14px;border:1px solid #e5eaf1;border-radius:17px;background:#fff}.stay-step-index{width:32px;height:32px;display:grid;place-items:center;border-radius:11px;background:var(--v11-primary-soft);color:#4665b7;font-weight:900}.stay-step-body{min-width:0}.stay-step-body header{margin-bottom:11px}.stay-step-body h3{margin:0 0 3px!important;font-size:14px!important}.stay-step-body header p{margin:0;font-size:11px;color:var(--v11-muted);font-weight:650}.form-grid.two-col{grid-template-columns:repeat(2,minmax(0,1fr))}.stay-fields{gap:10px!important}.stay-override-box{margin-top:10px;padding:10px;border:1px dashed #e0c991;border-radius:13px;background:#fffaf0}.switch-row{display:grid!important;grid-template-columns:20px 1fr!important;align-items:start!important;gap:9px!important;cursor:pointer}.switch-row input{width:18px!important;height:18px!important;min-height:18px!important;margin-top:2px;accent-color:#6a82c8}.switch-row>span{display:grid;gap:2px}.switch-row b{font-size:12px}.switch-row small{font-size:10px!important}.stay-override-box label:last-child{margin-top:9px}.is-hidden{display:none!important}.stay-allocation-preview{margin-top:9px;min-height:38px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:8px 10px;border-radius:11px;background:#f7f9fc;color:#607087;font-size:11px;font-weight:700}.stay-allocation-preview b{color:#2d4264}.stay-submit-bar{position:sticky;bottom:10px;z-index:15;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:13px 14px;margin-top:2px;border:1px solid #dce5f0;border-radius:16px;background:rgba(255,255,255,.96);box-shadow:0 15px 36px rgba(31,47,70,.12);backdrop-filter:blur(8px)}.stay-cost-preview{display:grid;gap:2px}.stay-cost-preview span{font-size:10px;color:var(--v11-muted);font-weight:750}.stay-cost-preview strong{font-size:17px;color:#334e91}.stay-cost-preview small{font-size:10px!important}.stay-history-panel{margin-top:16px}.stay-history-head{align-items:flex-start}.stay-list-filter{display:flex;gap:8px}.stay-list-filter input{min-width:220px}.stay-card-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.stay-record{display:grid;gap:11px;padding:14px;border:1px solid #e3e9f1;border-radius:17px;background:#fff}.stay-record[hidden]{display:none}.stay-record-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.stay-record-top h3{margin:6px 0 2px!important;font-size:14px!important}.stay-record-top p{margin:0;color:var(--v11-muted);font-size:11px;font-weight:650}.stay-record-top>strong{font-size:15px;color:#334e91;white-space:nowrap}.stay-record-top>strong small{font-size:9px!important}.stay-record-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.stay-record-grid span{display:grid;gap:2px;padding:8px 9px;border-radius:10px;background:#f8fafc}.stay-record-grid small{font-size:10px!important}.stay-record-grid b{font-size:11px}.stay-override-note{padding:8px 10px;border-radius:10px;background:#fff8e9;color:#806329;font-size:11px;font-weight:700}.stay-record-actions{display:flex;justify-content:flex-end;border-top:1px solid #edf1f6;padding-top:9px} /* dashboard v11 */ .dashboard-greeting-compact{min-height:120px!important;max-height:150px!important;margin-bottom:12px!important;border-radius:22px!important}.dashboard-greeting-compact .razavi-greeting-v41__message{min-height:120px!important}.dashboard-v11-head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin:4px 0 14px;padding:4px 2px}.dashboard-v11-head h1{margin:3px 0!important}.dashboard-v11-head p{margin:0;color:var(--v11-muted);font-weight:650}.dashboard-v11-head time{padding:7px 10px;border:1px solid var(--v11-line);border-radius:11px;background:#fff;color:#617087;font-size:11px;font-weight:800}.dashboard-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:14px}.dashboard-kpi{display:flex;align-items:center;gap:12px;padding:14px;border:1px solid var(--v11-line);border-radius:17px;background:#fff;text-decoration:none;box-shadow:0 6px 18px rgba(31,47,70,.035)}.dashboard-kpi:hover{transform:translateY(-2px);box-shadow:var(--v11-shadow);border-color:#cdd9eb}.kpi-icon{width:42px;height:42px;flex:0 0 auto;display:grid;place-items:center;border-radius:13px;background:#eef3ff;color:#5675cb;font-size:18px;font-weight:900}.kpi-icon.stay{background:#edf8f5;color:#438675}.kpi-icon.free{background:#f2f7ff;color:#6290c0}.kpi-icon.alert{background:#fff6e8;color:#a27b32}.dashboard-kpi.needs-attention{border-color:#ead7ac;background:#fffdf7}.dashboard-kpi div{display:grid;grid-template-columns:1fr auto;gap:1px 8px;min-width:0;flex:1}.dashboard-kpi small{grid-column:1;font-size:10px!important}.dashboard-kpi strong{grid-column:2;grid-row:1/3;font-size:24px;color:#263c62}.dashboard-kpi p{grid-column:1;margin:0;color:var(--v11-muted);font-size:10px;font-weight:650}.dashboard-action-strip{margin-bottom:14px}.dashboard-section-title{margin-bottom:8px}.dashboard-section-title h2{margin:0 0 2px!important}.dashboard-section-title p{margin:0;color:var(--v11-muted);font-size:11px;font-weight:650}.quick-action-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}.quick-action-grid a{display:grid;gap:3px;min-height:90px;padding:12px;border:1px solid var(--v11-line);border-radius:15px;background:#fff;text-decoration:none}.quick-action-grid a:hover{border-color:#cbd8ed;background:#f9fbff;transform:translateY(-2px);box-shadow:0 12px 25px rgba(31,47,70,.06)}.quick-action-grid a>span{font-size:18px;color:#5d7ed3}.quick-action-grid b{font-size:12px}.quick-action-grid small{font-size:10px!important;line-height:1.6}.dashboard-v11-grid{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(280px,.7fr);gap:12px;margin-bottom:14px}.dashboard-schedule-panel{padding:16px!important}.dashboard-timeline{display:grid}.timeline-row{display:grid;grid-template-columns:130px 15px 1fr auto;gap:10px;align-items:center;padding:10px 2px;border-bottom:1px solid #edf1f6}.timeline-row:last-child{border-bottom:0}.timeline-date{display:grid;gap:2px}.timeline-date b{font-size:11px}.timeline-date small{font-size:9px!important}.timeline-marker{width:9px;height:9px;border-radius:50%;background:#6f8ed7;box-shadow:0 0 0 4px #edf2ff}.timeline-row.cleaning .timeline-marker{background:#65a38f;box-shadow:0 0 0 4px #edf8f4}.timeline-row.maintenance .timeline-marker,.timeline-row.change .timeline-marker{background:#c19a50;box-shadow:0 0 0 4px #fff7e8}.timeline-row.blocked .timeline-marker{background:#bf6565;box-shadow:0 0 0 4px #fff0f0}.timeline-copy{display:grid;gap:2px}.timeline-copy b{font-size:12px}.timeline-copy small{font-size:10px!important}.timeline-owner{padding:5px 8px;border-radius:9px;background:#f5f7fa;color:#56667a;font-size:10px;font-weight:800}.dashboard-v11-side{display:grid;gap:12px;align-content:start}.dashboard-attention-panel,.dashboard-property-summary{padding:15px!important}.attention-list{display:grid;gap:6px}.attention-list a{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 10px;border-radius:10px;background:#f8fafc;text-decoration:none;font-size:11px;font-weight:750}.attention-list a:hover{background:#f1f5ff;color:#3656ad}.attention-list b{min-width:24px;height:24px;display:grid;place-items:center;border-radius:8px;background:#fff}.property-summary-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}.property-summary-grid>div{display:grid;gap:2px;padding:9px;border:1px solid #edf1f6;border-radius:11px}.property-summary-grid span{font-size:10px;color:var(--v11-muted);font-weight:700}.property-summary-grid b{font-size:15px}.dashboard-recent-activity{padding:16px!important}.recent-activity-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.recent-activity-grid article{display:grid;grid-template-columns:10px 1fr auto;gap:8px;align-items:center;padding:9px;border:1px solid #edf1f6;border-radius:11px}.activity-dot{width:7px;height:7px;border-radius:50%;background:#738ed7}.recent-activity-grid article div{display:grid;gap:1px}.recent-activity-grid b{font-size:11px}.recent-activity-grid small{font-size:9px!important}.recent-activity-grid time{font-size:9px;color:#8694a6}.owner-rights-hero{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px;border:1px solid #dce5f2;border-radius:20px;background:linear-gradient(135deg,#fff,#f4f8ff);margin-bottom:10px}.owner-rights-hero h2{margin:3px 0!important}.owner-rights-hero p{margin:0;color:var(--v11-muted);font-weight:650}.owner-credit-ring{width:120px;height:120px;flex:0 0 auto;display:grid;place-items:center;align-content:center;text-align:center;border-radius:50%;background:#fff;border:10px solid #e8eefc}.owner-credit-ring strong{font-size:27px;color:#3d5eb6}.owner-credit-ring span{font-size:9px;color:var(--v11-muted);font-weight:700}.owner-season-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:10px}.owner-season-grid article{display:grid;gap:3px;padding:12px;border:1px solid var(--v11-line);border-radius:14px}.owner-season-grid article.open{background:#f2fbf7;border-color:#d2e9df}.owner-season-grid article.used{background:#f8f9fb;color:#6c788a}.owner-season-grid span{font-size:11px;font-weight:800}.owner-season-grid b{font-size:12px}.owner-season-grid small{font-size:10px!important}.owner-dashboard-actions{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px} /* selective test cleanup */ .cleanup-center{display:grid;gap:13px}.cleanup-preset-bar{display:flex;gap:8px}.cleanup-choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.cleanup-choice{display:grid;grid-template-columns:22px 1fr;gap:9px;align-items:start;padding:12px;border:1px solid #e3e9f1;border-radius:14px;background:#fff;cursor:pointer}.cleanup-choice:hover{border-color:#cfd9e8;background:#fbfcff}.cleanup-choice:has(input:checked){border-color:#b8c9f1;background:#f4f7ff}.cleanup-choice.critical:has(input:checked){border-color:#e6b6b6;background:#fff7f7}.cleanup-choice input{width:18px!important;height:18px!important;min-height:18px!important;accent-color:#5d7ed3;margin-top:2px}.cleanup-choice span{display:grid;gap:3px}.cleanup-choice b{font-size:12px}.cleanup-choice small{font-size:10px!important;line-height:1.7}.cleanup-preview{display:grid;grid-template-columns:220px 1fr;gap:12px;padding:12px;border:1px solid #e0e7f0;border-radius:14px;background:#f8fafc}.cleanup-preview>div{display:grid;align-content:start;gap:3px}.cleanup-preview span{font-size:10px;color:var(--v11-muted);font-weight:750}.cleanup-preview b{font-size:12px}.cleanup-preview ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;margin:0;padding:0;list-style:none}.cleanup-preview li{display:flex;justify-content:space-between;gap:9px;padding:6px 8px;border-radius:8px;background:#fff;font-size:10px}.cleanup-confirm-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.cleanup-submit{justify-self:start} /* Login compact mobile: less vertical waste, same readable font size */ @media(max-width:520px){ .login-v4 .login-v4__form-pane{padding:10px 14px 12px!important;justify-content:flex-start!important;overflow:auto} .login-v4 .login-v4__mobile-brand{margin:2px 0 8px!important}.login-v4 .login-v4__brand-mark{width:42px!important;height:42px!important;flex-basis:42px!important}.login-v4 .login-v4__brand-copy strong{font-size:17px!important}.login-v4 .login-v4__brand-copy small{font-size:12px!important;font-weight:700!important} .login-v4 .login-v4__card{padding:18px 17px!important;border-radius:20px!important}.login-v4 .login-v4__welcome{padding:5px 9px!important;font-size:12px!important}.login-v4 .login-v4__card-header h2{margin:9px 0 3px!important;font-size:24px!important}.login-v4 .login-v4__card-header p{font-size:13px!important;line-height:1.65!important;font-weight:650!important} .login-v4 .login-v4__form{margin-top:14px!important;gap:11px!important}.login-v4 .login-v4__account-type legend,.login-v4 .login-v4__field>label{margin-bottom:5px!important;font-size:14px!important}.login-v4 .login-v4__segmented label>span{min-height:42px!important;font-size:14px!important}.login-v4 .login-v4__field-control input:not([type=checkbox]){height:49px!important;min-height:49px!important;font-size:15px!important}.login-v4 .login-v4__remember b{font-size:13px!important}.login-v4 .login-v4__remember small{font-size:11px!important;font-weight:650!important}.login-v4 .login-v4__submit.button{min-height:49px!important;font-size:15px!important}.login-v4 .login-v4__help{margin-top:10px!important;padding:8px 10px!important;font-size:12px!important;line-height:1.55!important}.login-v4 .login-v4__copyright{margin-top:8px!important;font-size:11px!important;font-weight:650!important} } @media(max-width:1100px){.report-filters{grid-template-columns:repeat(3,minmax(0,1fr))}.dashboard-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.quick-action-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.recent-activity-grid{grid-template-columns:1fr 1fr}.stay-card-list{grid-template-columns:1fr}} @media(max-width:760px){ .toast-stack{top:10px;left:10px;width:calc(100vw - 20px)}.ds-toast{grid-template-columns:28px 1fr 28px;padding:11px 12px} .ds-select.open .ds-select-menu{position:fixed;z-index:100020;top:auto;right:10px;left:10px;bottom:calc(10px + env(safe-area-inset-bottom));max-height:68svh;border-radius:20px;padding:10px}.ds-select-options{max-height:52svh}.ds-select-option{min-height:46px!important;font-size:14px!important} .usage-summary-card{grid-template-columns:1fr}.usage-summary-main{border-left:0;border-bottom:1px solid var(--v11-line);padding:4px 2px 10px}.season-rights-grid{grid-template-columns:1fr 1fr}.report-filter-toggle{display:inline-flex!important;margin-bottom:7px}.report-filters{display:none;grid-template-columns:1fr 1fr}.report-filters.open{display:grid}.report-filter-actions{grid-column:1/-1}.history-record-main{grid-template-columns:1fr;gap:10px}.history-record-facts{grid-template-columns:1fr 1fr}.history-detail-grid{grid-template-columns:1fr 1fr}.history-detail-grid .span-2{grid-column:1/-1} .stay-workflow{padding:14px!important}.stay-workflow-head{display:grid}.stay-rate-card{width:100%}.stay-step{grid-template-columns:30px 1fr;padding:11px;gap:8px}.stay-step-index{width:28px;height:28px}.form-grid.two-col,.stay-fields{grid-template-columns:1fr!important}.stay-submit-bar{bottom:calc(70px + env(safe-area-inset-bottom));display:grid;grid-template-columns:1fr auto;padding:10px 11px}.stay-submit-bar .button{min-height:46px}.stay-history-head{display:grid}.stay-list-filter{display:grid;grid-template-columns:1fr 1fr;width:100%}.stay-list-filter input{min-width:0}.stay-record-grid{grid-template-columns:1fr 1fr} .dashboard-greeting-compact{min-height:88px!important;max-height:100px!important}.dashboard-v11-head{align-items:flex-start}.dashboard-v11-head time{display:none}.dashboard-kpis{grid-template-columns:1fr 1fr}.dashboard-kpi{padding:10px}.kpi-icon{width:36px;height:36px}.dashboard-kpi strong{font-size:20px}.quick-action-grid{grid-template-columns:1fr 1fr}.quick-action-grid a{min-height:82px}.dashboard-v11-grid{grid-template-columns:1fr}.timeline-row{grid-template-columns:95px 12px 1fr}.timeline-owner{grid-column:3}.recent-activity-grid{grid-template-columns:1fr}.owner-rights-hero{align-items:flex-start}.owner-credit-ring{width:92px;height:92px;border-width:8px}.owner-season-grid{grid-template-columns:1fr 1fr}.owner-dashboard-actions{display:grid;grid-template-columns:1fr 1fr} .cleanup-choice-grid{grid-template-columns:1fr}.cleanup-preview{grid-template-columns:1fr}.cleanup-preview ul{grid-template-columns:1fr}.cleanup-confirm-grid{grid-template-columns:1fr}.cleanup-submit{width:100%}.cleanup-preset-bar{display:grid;grid-template-columns:1fr 1fr} } @media(max-width:460px){.dashboard-kpis{grid-template-columns:1fr}.history-record-facts,.history-detail-grid,.stay-record-grid,.season-rights-grid,.owner-season-grid{grid-template-columns:1fr}.stay-list-filter,.owner-dashboard-actions{grid-template-columns:1fr}.report-filters{grid-template-columns:1fr}.stay-submit-bar{grid-template-columns:1fr}.stay-submit-bar .button{width:100%}.timeline-row{grid-template-columns:84px 10px 1fr}.quick-action-grid{grid-template-columns:1fr 1fr}} /* v11.1 — dashboard typography readability: larger, stronger small copy without bloating layout */ .dashboard-v11-head .eyebrow{font-size:13px!important;font-weight:850!important;letter-spacing:0!important} .dashboard-v11-head h1{font-size:clamp(1.95rem,2.5vw,2.5rem)!important;line-height:1.35!important} .dashboard-v11-head p{font-size:14px!important;line-height:1.8!important;font-weight:750!important;color:#5d6d82!important} .dashboard-v11-head time{font-size:12px!important;font-weight:850!important} .dashboard-section-title h2,.dashboard-schedule-panel .panel-head h2,.dashboard-attention-panel .panel-head h2,.dashboard-property-summary .panel-head h2,.dashboard-recent-activity .panel-head h2{font-size:1.24rem!important;line-height:1.5!important} .dashboard-section-title p,.dashboard-schedule-panel .panel-head p,.dashboard-attention-panel .panel-head p,.dashboard-property-summary .panel-head p,.dashboard-recent-activity .panel-head p{font-size:13px!important;line-height:1.75!important;font-weight:750!important;color:#617087!important} .dashboard-schedule-panel .panel-head>a,.dashboard-recent-activity .panel-head>a{font-size:12px!important;font-weight:850!important} .dashboard-kpi{padding:15px 16px!important;gap:13px!important} .dashboard-kpi small{font-size:12px!important;line-height:1.55!important;font-weight:850!important;color:#52627a!important} .dashboard-kpi strong{font-size:26px!important;line-height:1.15!important;font-weight:900!important;color:#263c62!important} .dashboard-kpi p{font-size:12px!important;line-height:1.55!important;font-weight:700!important;color:#6a788b!important} .kpi-icon{width:44px!important;height:44px!important;font-size:19px!important} .quick-action-grid a{min-height:104px!important;padding:14px!important;gap:5px!important} .quick-action-grid a>span{font-size:20px!important} .quick-action-grid b{font-size:14px!important;line-height:1.55!important;font-weight:900!important;color:#283a53!important} .quick-action-grid small{font-size:12px!important;line-height:1.75!important;font-weight:700!important;color:#68778a!important} .timeline-row{padding:12px 2px!important} .timeline-date b{font-size:13px!important;line-height:1.55!important;font-weight:850!important} .timeline-date small{font-size:11px!important;line-height:1.55!important;font-weight:700!important;color:#7a8798!important} .timeline-copy b{font-size:14px!important;line-height:1.55!important;font-weight:900!important;color:#2a3a50!important} .timeline-copy small{font-size:12px!important;line-height:1.65!important;font-weight:700!important;color:#69788b!important} .timeline-owner{font-size:12px!important;line-height:1.5!important;font-weight:850!important;padding:6px 9px!important} .attention-list a{font-size:13px!important;line-height:1.6!important;font-weight:800!important;padding:10px 11px!important} .attention-list b{font-size:13px!important;font-weight:900!important} .property-summary-grid span{font-size:12px!important;line-height:1.55!important;font-weight:800!important;color:#627287!important} .property-summary-grid b{font-size:17px!important;line-height:1.35!important;font-weight:900!important} .property-summary-grid>div{padding:10px!important;gap:3px!important} .recent-activity-grid b{font-size:13px!important;line-height:1.55!important;font-weight:900!important} .recent-activity-grid small{font-size:11px!important;line-height:1.65!important;font-weight:700!important;color:#6e7c8e!important} .recent-activity-grid time{font-size:11px!important;font-weight:700!important;color:#7d8a9b!important} .recent-activity-grid article{padding:11px!important} .owner-rights-hero .eyebrow{font-size:12px!important} .owner-rights-hero p{font-size:13px!important;line-height:1.75!important;font-weight:750!important} .owner-credit-ring span{font-size:11px!important;line-height:1.55!important;font-weight:800!important} .owner-season-grid span{font-size:13px!important;font-weight:850!important} .owner-season-grid b{font-size:14px!important;line-height:1.55!important;font-weight:900!important} .owner-season-grid small{font-size:11px!important;line-height:1.65!important;font-weight:700!important} @media(max-width:760px){ .dashboard-v11-head h1{font-size:1.7rem!important} .dashboard-v11-head p{font-size:13px!important} .dashboard-kpi{padding:12px!important;gap:10px!important} .dashboard-kpi small{font-size:11.5px!important} .dashboard-kpi strong{font-size:22px!important} .dashboard-kpi p{font-size:11.5px!important} .kpi-icon{width:38px!important;height:38px!important;font-size:17px!important} .quick-action-grid a{min-height:96px!important;padding:13px!important} .quick-action-grid b{font-size:13.5px!important} .quick-action-grid small{font-size:11.5px!important;line-height:1.7!important} .dashboard-section-title p,.dashboard-schedule-panel .panel-head p,.dashboard-attention-panel .panel-head p,.dashboard-property-summary .panel-head p,.dashboard-recent-activity .panel-head p{font-size:12px!important} .timeline-date b{font-size:12px!important}.timeline-date small{font-size:10.5px!important} .timeline-copy b{font-size:13px!important}.timeline-copy small{font-size:11.5px!important} .timeline-owner{font-size:11.5px!important} .attention-list a{font-size:12.5px!important} .property-summary-grid span{font-size:11.5px!important}.property-summary-grid b{font-size:16px!important} .recent-activity-grid b{font-size:12.5px!important}.recent-activity-grid small,.recent-activity-grid time{font-size:10.5px!important} } @media(max-width:460px){ .dashboard-kpi small{font-size:12px!important} .dashboard-kpi p{font-size:11.5px!important} .quick-action-grid b{font-size:13px!important} .quick-action-grid small{font-size:11px!important} } /* ===== mobile-first-v12.css ===== */ /* * Hammelk Mobile First v12 * Central mobile UX authority. Loaded after all legacy/theme layers. * Goal: readable typography, touch-sized controls, deliberate mobile layouts, * and a usable calendar without shrinking the desktop UI. */ :root{ --m12-text:#203047; --m12-muted:#617087; --m12-line:#dfe7f1; --m12-soft:#f7f9fc; --m12-primary:#5d7ed3; --m12-primary-soft:#eef3ff; --m12-radius:18px; --m12-touch:48px; } @media (max-width:900px){ html{font-size:16px!important;-webkit-text-size-adjust:100%;text-size-adjust:100%} body{font-size:15px!important;line-height:1.8!important;color:var(--m12-text)!important;overflow-x:hidden} .app-shell .workspace{margin-right:0!important;min-width:0!important} .app-shell .page-content{width:100%!important;max-width:none!important;padding:16px 14px calc(96px + env(safe-area-inset-bottom))!important} /* Header: larger and easier to touch/read. */ .app-shell .topbar,.app-shell .topbar.topbar-modern{height:66px!important;min-height:66px!important;padding:0 14px!important;gap:10px!important} .app-shell .topbar-title>b{font-size:17px!important;line-height:1.35!important;font-weight:900!important} .app-shell .topbar-meta,.app-shell .topbar-meta small,.app-shell .topbar-title small{font-size:12px!important;font-weight:750!important;color:#6b798b!important} .app-shell .menu-button{display:grid!important;place-items:center!important;width:48px!important;height:48px!important;min-height:48px!important;border:1px solid #dce4ee!important;border-radius:14px!important;background:#fff!important;color:#536379!important;box-shadow:none!important;margin:0!important} .app-shell .topbar-actions{gap:7px!important} .app-shell .topbar-quick{display:none!important} .app-shell .notification-bell,.app-shell .topbar-actions>.icon-button{width:46px!important;height:46px!important;min-height:46px!important;border:1px solid #dce4ee!important;border-radius:14px!important;background:#fff!important;display:grid!important;place-items:center!important} .app-shell .small-avatar{display:none!important} /* Global mobile typography. Never gain space by making text tiny. */ .app-shell h1{font-size:clamp(1.7rem,7vw,2.15rem)!important;line-height:1.4!important} .app-shell h2{font-size:1.35rem!important;line-height:1.5!important} .app-shell h3{font-size:1.08rem!important;line-height:1.55!important} .app-shell h4{font-size:1rem!important} .app-shell :is(p,li,td,dd){font-size:14px;line-height:1.8} .app-shell :is(small,.small,.muted,.form-hint,.field-help,.cell-note,.eyebrow){font-size:12.5px!important;line-height:1.75!important;font-weight:700!important;color:var(--m12-muted)!important} .app-shell :is(label,.form-grid label,.settings-field>span,.user-fields label,.owner-fields label){font-size:14px!important;font-weight:850!important;line-height:1.7!important;color:#45556b!important} /* Touch controls. 16px input text also prevents mobile browser zoom. */ .app-shell :is(input:not([type=checkbox]):not([type=radio]),select,textarea){font-size:16px!important;line-height:1.5!important;min-height:var(--m12-touch)!important;border-radius:13px!important;padding:10px 12px!important} .app-shell textarea{min-height:96px!important} .app-shell :is(.button,button:not(.calendar-day):not(.booking-date):not(.ds-select-option)){min-height:46px!important;font-size:14px!important;font-weight:850!important;border-radius:13px!important} .app-shell .button.compact{min-height:44px!important;padding:8px 12px!important} .app-shell :is(input[type=checkbox],input[type=radio]){min-width:20px!important;width:20px!important;height:20px!important;min-height:20px!important} /* General cards / pages. */ .app-shell :is(.panel,.simple-card,.settings-section-card,.provider-card,.request-card,.account-card){border-radius:18px!important} .app-shell .panel{padding:16px!important} .app-shell .panel-head,.app-shell .page-heading,.app-shell .ds-page-header,.app-shell .users-heading{gap:10px!important;margin-bottom:14px!important} .app-shell .panel-head h2,.app-shell .page-heading h1,.app-shell .ds-page-header h1,.app-shell .users-heading h1{margin-bottom:4px!important} .app-shell .panel-head p,.app-shell .page-heading p,.app-shell .ds-page-header p,.app-shell .users-heading p{font-size:13px!important;line-height:1.8!important;font-weight:700!important} .app-shell .heading-actions,.app-shell .actions,.app-shell .hero-actions{width:100%;display:grid!important;grid-template-columns:1fr 1fr;gap:8px!important} .app-shell .heading-actions>* ,.app-shell .actions>* ,.app-shell .hero-actions>*{width:100%!important} /* Form grids become purposeful one-column mobile flows. */ .app-shell :is(.form-grid,.grid,.grid-form,.user-fields,.owner-fields,.provider-fields,.bank-form-grid,.settings-fields-grid,.settings-fields-grid.two-col,.two-field-grid,.cleanup-confirm-grid){grid-template-columns:1fr!important;gap:12px!important} .app-shell :is(.wide,.span-2,.span-3){grid-column:auto!important} .app-shell fieldset{min-width:0} /* Central smart list / dropdown component. */ .app-shell .ds-select-trigger{min-height:50px!important;background:#fff!important;color:#25364d!important;border:1px solid #d8e2ef!important;font-size:15px!important;font-weight:800!important;border-radius:14px!important;padding:10px 13px!important;box-shadow:none!important} .app-shell .ds-select-trigger:hover,.app-shell .ds-select.open .ds-select-trigger{background:#fff!important;color:#25364d!important} .app-shell .ds-select.open .ds-select-menu{right:12px!important;left:12px!important;bottom:calc(12px + env(safe-area-inset-bottom))!important;max-height:72svh!important;border-radius:22px!important;padding:12px!important} .app-shell .ds-select-search input{min-height:48px!important;font-size:16px!important} .app-shell .ds-select-options{max-height:56svh!important;gap:5px!important} .app-shell .ds-select-option{min-height:50px!important;font-size:15px!important;padding:10px 12px!important;border-radius:12px!important;background:#fff!important;color:#31435b!important} .app-shell .ds-select-option.active,.app-shell .ds-select-option:hover,.app-shell .ds-select-option[aria-selected="true"]{background:#eef3ff!important;color:#3656ad!important} /* Mobile card tables. Standard card-table when the template opted in. */ .app-shell .table-wrap.mobile-cards{border:0!important;background:transparent!important;overflow:visible!important} .app-shell .table-wrap.mobile-cards table,.app-shell .table-wrap.mobile-cards tbody{display:block!important;width:100%!important} .app-shell .table-wrap.mobile-cards thead{display:none!important} .app-shell .table-wrap.mobile-cards tr{display:block!important;margin:0 0 12px!important;padding:12px 14px!important;border:1px solid var(--m12-line)!important;border-radius:17px!important;background:#fff!important;box-shadow:0 6px 20px rgba(31,47,70,.045)!important} .app-shell .table-wrap.mobile-cards td{display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:14px!important;width:100%!important;padding:9px 0!important;border:0!important;border-bottom:1px dashed #e7edf5!important;font-size:13.5px!important;text-align:left!important;white-space:normal!important} .app-shell .table-wrap.mobile-cards td:last-child{border-bottom:0!important} .app-shell .table-wrap.mobile-cards td::before{content:attr(data-label);flex:0 0 38%;font-size:12.5px!important;font-weight:850!important;color:#758398!important;text-align:right!important} .app-shell .table-wrap.mobile-cards td[colspan]::before{display:none!important} .app-shell .table-wrap:not(.mobile-cards){overflow-x:auto!important;-webkit-overflow-scrolling:touch} .app-shell .table-wrap:not(.mobile-cards) table{min-width:680px} /* Mobile dock. */ .app-shell~.mobile-dock,.mobile-dock{height:76px!important;padding:7px 8px calc(7px + env(safe-area-inset-bottom))!important;background:rgba(255,255,255,.98)!important;border-top:1px solid #dfe7f1!important;box-shadow:0 -10px 28px rgba(31,47,70,.08)!important} .mobile-dock a,.mobile-dock button{min-height:58px!important;border-radius:16px!important;gap:4px!important;font-size:12.5px!important;font-weight:800!important} .mobile-dock .icon{width:24px!important;height:24px!important} .mobile-dock a.active{background:#eef3ff!important;color:#5070c5!important} .mobile-dock .dock-count{font-size:10px!important;min-width:18px!important;height:18px!important} /* Sidebar as real mobile drawer. */ .app-shell .sidebar{width:min(330px,88vw)!important;padding:15px!important} .app-shell .menu-section{min-height:52px!important;font-size:14px!important} .app-shell .menu-section>span:not(.menu-open-mark):not(.nav-count){font-size:14px!important} .app-shell .suite-overview-item b{font-size:13px!important} .app-shell .sidebar-account b{font-size:14px!important} .app-shell .sidebar-account small{font-size:12px!important} /* Section hub pages. */ .section-hub-hero{padding:18px!important;border-radius:20px!important;gap:13px!important} .section-hub-icon{width:54px!important;height:54px!important;border-radius:16px!important} .section-hub-copy p{font-size:13px!important;line-height:1.8!important} .section-hub-grid{grid-template-columns:1fr!important;gap:11px!important} .section-hub-card{min-height:104px!important;padding:15px!important;border-radius:18px!important} .section-hub-card-copy strong{font-size:15px!important}.section-hub-card-copy small{font-size:12.5px!important} /* Owners / users / account cards. */ .app-shell :is(.owner-card-grid,.user-card-grid,.bank-grid-modern,.provider-grid,.period-cards,.profile-section-grid,.account-grid){grid-template-columns:1fr!important} .app-shell .stat-grid,.app-shell .stat-grid.three,.app-shell .user-stat-grid{grid-template-columns:1fr 1fr!important;gap:10px!important} .app-shell .stat-card,.app-shell .user-stat{padding:13px!important;min-height:92px!important} .app-shell .stat-card span,.app-shell .user-stat span{font-size:12.5px!important;font-weight:800!important} .app-shell .stat-card strong,.app-shell .user-stat strong{font-size:23px!important} .app-shell .owner-card,.app-shell .user-card,.app-shell .bank-card-modern{padding:15px!important;border-radius:18px!important} .app-shell .owner-quick-info,.app-shell .owner-metrics,.app-shell .user-meta-grid,.app-shell .info-grid,.app-shell .owner-profile-stats{grid-template-columns:1fr 1fr!important;gap:8px!important} .app-shell .owner-profile-hero{display:grid!important;gap:14px!important} .app-shell .owner-profile-stats{width:100%!important} .app-shell .owner-profile-stats>div,.app-shell .info-grid>div{padding:10px!important} .app-shell .owner-profile-stats span,.app-shell .info-grid span{font-size:12px!important;font-weight:800!important} .app-shell .owner-profile-stats strong,.app-shell .info-grid b{font-size:14px!important;overflow-wrap:anywhere} .app-shell .card-actions,.app-shell .user-card-actions,.app-shell .bank-card-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important} .app-shell .card-actions>* ,.app-shell .user-card-actions>* ,.app-shell .bank-card-actions>*{width:100%!important;min-width:0!important} /* Owner wizard: horizontal step rail + readable fields. */ .app-shell .owner-tabs{display:flex!important;overflow-x:auto!important;gap:7px!important;padding:4px 1px 10px!important;scroll-snap-type:x proximity} .app-shell .owner-tab{flex:0 0 auto!important;min-width:126px!important;min-height:48px!important;padding:8px 10px!important;font-size:13px!important;scroll-snap-align:start} .app-shell .owner-wizard-content{padding:14px!important} .app-shell .section-title h3{font-size:17px!important}.app-shell .section-title p{font-size:13px!important} /* Settings / maintenance. */ .app-shell .settings-hero{padding:18px!important;border-radius:20px!important} .app-shell .settings-jump-nav{top:66px!important;padding:8px!important;gap:7px!important;overflow-x:auto!important;flex-wrap:nowrap!important} .app-shell .settings-jump-nav a{min-height:42px!important;white-space:nowrap!important;font-size:13px!important;padding:8px 11px!important} .app-shell .settings-section-card{padding:16px!important;border-radius:18px!important} .app-shell .settings-field{padding:12px!important;border-radius:14px!important} .app-shell .cleanup-choice{padding:12px!important}.app-shell .cleanup-choice b{font-size:14px!important}.app-shell .cleanup-choice small{font-size:12px!important} /* Banking and communication dialogs become bottom sheets. */ .app-shell dialog.bank-dialog{width:100%!important;max-width:none!important;max-height:92svh!important;margin:auto 0 0!important;border-radius:22px 22px 0 0!important} .app-shell .bank-dialog-head{padding:16px!important}.app-shell .bank-form-body{padding:14px!important}.app-shell .bank-form-section{padding:13px!important} .app-shell .bank-dialog-actions{position:sticky!important;bottom:0!important;display:grid!important;grid-template-columns:1fr 1fr!important;padding:12px 14px calc(12px + env(safe-area-inset-bottom))!important} .app-shell .bank-identifiers,.app-shell .bank-balance-card,.app-shell .bank-reconcile-status{grid-template-columns:1fr!important} .app-shell .provider-card{padding:15px!important}.app-shell .provider-actions{display:grid!important;grid-template-columns:1fr!important;gap:8px!important} /* Backup / access / miscellaneous grids. */ .app-shell :is(.backup-summary-grid,.backup-path-grid,.permission-group-grid.access-grid,.role-card-grid,.exchange-help-grid){grid-template-columns:1fr!important} .app-shell .permission-toolbar{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important} .app-shell .permission-group{padding:13px!important} /* History / stay workflow. */ .usage-summary-card{grid-template-columns:1fr!important;padding:14px!important}.season-rights-grid{grid-template-columns:1fr 1fr!important} .report-tabs{margin-inline:-2px!important;padding-bottom:8px!important}.report-tabs a{min-height:46px!important;font-size:13px!important;padding:9px 12px!important} .report-filter-toggle{display:flex!important;width:100%!important;justify-content:center!important} .report-filters{grid-template-columns:1fr!important;padding:12px!important}.report-filters label{font-size:13px!important}.report-filter-actions{grid-column:auto!important;display:grid!important;grid-template-columns:1fr 1fr!important} .history-record-main{grid-template-columns:1fr!important;padding:13px!important}.history-record-title h3{font-size:15px!important}.history-record-title p{font-size:12.5px!important}.history-state{font-size:11.5px!important} .history-record-facts,.history-detail-grid{grid-template-columns:1fr!important}.history-record-facts small,.history-detail-grid span{font-size:11.5px!important}.history-record-facts b,.history-detail-grid b{font-size:13px!important} .stay-workflow{padding:14px!important}.stay-step{grid-template-columns:36px 1fr!important;gap:9px!important;padding:13px!important}.stay-step-index{width:34px!important;height:34px!important;font-size:14px!important} .stay-step-body h3{font-size:16px!important}.stay-step-body>p{font-size:12.5px!important}.stay-rate-card{width:100%!important}.stay-submit-bar{bottom:calc(76px + env(safe-area-inset-bottom))!important;padding:10px 12px!important;grid-template-columns:1fr!important}.stay-submit-bar .button{width:100%!important} .stay-list-filter{grid-template-columns:1fr!important}.stay-record-grid{grid-template-columns:1fr!important} /* Dashboard: one-column KPIs on phones/tablet portrait; readable quick actions. */ .dashboard-greeting-compact{min-height:auto!important;max-height:none!important} .dashboard-v11-head{display:grid!important;gap:5px!important;margin:12px 2px 16px!important}.dashboard-v11-head h1{font-size:1.9rem!important}.dashboard-v11-head p{font-size:14px!important}.dashboard-v11-head time{display:none!important} .dashboard-kpis{grid-template-columns:1fr!important;gap:10px!important}.dashboard-kpi{min-height:92px!important;padding:14px!important}.dashboard-kpi small{font-size:13.5px!important}.dashboard-kpi p{font-size:13px!important}.dashboard-kpi strong{font-size:28px!important}.kpi-icon{width:52px!important;height:52px!important;font-size:21px!important} .dashboard-section-title h2{font-size:1.45rem!important}.dashboard-section-title p{font-size:13px!important} .quick-action-grid{grid-template-columns:1fr 1fr!important;gap:10px!important}.quick-action-grid a{min-height:112px!important;padding:14px!important}.quick-action-grid b{font-size:14px!important}.quick-action-grid small{font-size:12.5px!important;line-height:1.75!important} .dashboard-v11-grid{grid-template-columns:1fr!important}.timeline-row{grid-template-columns:92px 12px 1fr!important;gap:8px!important}.timeline-owner{grid-column:3!important}.timeline-copy b{font-size:14px!important}.timeline-copy small{font-size:12px!important}.timeline-date b{font-size:13px!important}.timeline-date small{font-size:11.5px!important} .attention-list a{font-size:13px!important;min-height:46px!important}.property-summary-grid{grid-template-columns:1fr 1fr!important}.recent-activity-grid{grid-template-columns:1fr!important} /* Calendar: mobile is a deliberate touch surface, not a squeezed desktop calendar. */ .calendar-workspace{gap:12px!important} .calendar-command-center{border-radius:20px!important;overflow:visible!important} .calendar-command-top{display:grid!important;grid-template-columns:1fr!important;gap:14px!important;padding:17px 16px!important} .calendar-command-heading .eyebrow{font-size:12.5px!important}.calendar-title-row{align-items:flex-start!important;gap:8px!important}.calendar-title-row h1{font-size:2rem!important}.calendar-command-heading p{font-size:13px!important;line-height:1.8!important} .calendar-cache-status{font-size:11.5px!important;min-height:32px!important;padding:5px 9px!important} .calendar-command-actions{width:100%!important;display:grid!important;grid-template-columns:1fr!important;gap:10px!important} .calendar-month-nav{width:100%!important;display:grid!important;grid-template-columns:48px 1fr 48px!important;gap:8px!important}.calendar-nav-button,.calendar-today{min-height:48px!important;font-size:14px!important;border-radius:13px!important} .calendar-create-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important}.calendar-create-actions .button{width:100%!important;min-height:48px!important;font-size:14px!important} .calendar-command-bar{display:grid!important;gap:11px!important;padding:12px 14px!important} .calendar-view-tabs{display:flex!important;width:100%!important;overflow-x:auto!important;gap:5px!important;padding:3px!important;scrollbar-width:none}.calendar-view-tabs::-webkit-scrollbar{display:none}.calendar-view-tabs a{flex:0 0 auto!important;min-width:82px!important;min-height:44px!important;display:grid!important;place-items:center!important;font-size:13.5px!important;padding:8px 12px!important} .calendar-mini-stats{width:100%!important;justify-content:space-between!important;gap:5px!important}.calendar-mini-stats span{font-size:12.5px!important}.calendar-mini-stats small{font-size:11.5px!important}.calendar-settings-link{min-height:42px!important;font-size:13px!important;justify-self:stretch!important;text-align:center!important} .calendar-filter-panel{margin:0 12px 12px!important;border-radius:16px!important}.calendar-filter-panel summary{min-height:52px!important;padding:12px 13px!important}.calendar-filter-panel summary span{font-size:14px!important}.calendar-filter-panel summary small{font-size:11.5px!important}.calendar-filters{grid-template-columns:1fr!important;padding:12px!important;gap:11px!important}.calendar-filters label>span{font-size:13px!important}.calendar-layer-checks{grid-column:auto!important;display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important}.calendar-layer-checks label,.filter-check{min-height:44px!important;font-size:13px!important;padding:8px 10px!important} /* Month keeps its semantics but becomes horizontally scrollable with useful cell sizes. */ .calendar-board{overflow-x:auto!important;overflow-y:hidden!important;-webkit-overflow-scrolling:touch;border-radius:18px!important;scroll-snap-type:x proximity} .calendar-week-head,.calendar-grid{min-width:770px!important} .calendar-week-head span{padding:11px 5px!important;font-size:13px!important;font-weight:900!important} .calendar-day,.app-shell .calendar-day{min-height:132px!important;padding:9px!important;scroll-snap-align:start} .calendar-day-number{width:34px!important;height:34px!important;font-size:16px!important;border-radius:10px!important} .holiday-mark{font-size:10.5px!important;padding:3px 6px!important} .calendar-day-items{gap:5px!important;margin-top:7px!important}.day-item{font-size:11.5px!important;padding:5px 6px!important;line-height:1.6!important;border-radius:8px!important}.day-more{font-size:11px!important;padding:3px 5px!important} .calendar-agenda-card{padding:13px!important;border-radius:18px!important}.agenda-day{grid-template-columns:68px 1fr!important;gap:10px!important}.agenda-date b{font-size:22px!important}.agenda-date span{font-size:12.5px!important}.agenda-date small{font-size:11px!important}.agenda-item b{font-size:14px!important}.agenda-item small{font-size:12px!important} /* Calendar drawers / booking sheets. */ .calendar-drawer,.calendar-workflow-drawer,.booking-dialog{width:100%!important;max-width:none!important;max-height:94svh!important;border-radius:22px 22px 0 0!important} .calendar-drawer-head,.workflow-drawer-head,.booking-dialog-head{padding:16px!important}.calendar-drawer-head h2,.workflow-drawer-head h2,.booking-dialog-head h2{font-size:19px!important} .calendar-panel-body{padding:13px 15px 84px!important}.panel-record b{font-size:14px!important}.panel-record small,.panel-record em{font-size:12px!important} #periodModal .booking-step-title b{font-size:15px!important}#periodModal .booking-step-title small{font-size:12px!important} #periodModal :is(label>span,.booking-mode-strip label>span){font-size:13px!important;font-weight:800!important} #periodModal :is(input,select,textarea){font-size:16px!important;min-height:48px!important} #periodModal .booking-suite-grid{grid-template-columns:1fr!important}.booking-mode-strip{grid-template-columns:1fr!important;padding:12px 15px!important} #periodModal #bookingDateGrid{gap:5px!important;padding:8px!important}.booking-calendar-weekdays{font-size:12px!important}.booking-date{min-height:48px!important}.booking-date span{font-size:13px!important} .calendar-panel-actions,.period-modal-actions,.calendar-event-form .modal-actions{padding:10px 12px calc(10px + env(safe-area-inset-bottom))!important}.calendar-panel-actions .button,.period-modal-actions .button,.calendar-event-form .modal-actions .button{min-height:48px!important;font-size:14px!important} /* Calendar settings. */ .calendar-settings-hero{padding:17px!important;border-radius:19px!important}.calendar-settings-title h1{font-size:1.8rem!important}.calendar-settings-title p{font-size:13px!important}.calendar-today-strip{grid-template-columns:1fr!important}.calendar-today-strip>div{padding:12px!important}.calendar-source-stats{grid-template-columns:1fr 1fr!important}.calendar-toggle-row{min-height:54px!important}.occasion-policy-row{grid-template-columns:1fr!important;gap:10px!important;padding:12px!important}.occasion-show-toggle b{font-size:13px!important}.occasion-show-toggle small{font-size:11.5px!important}.occasion-priority{grid-template-columns:1fr 86px!important}.occasion-priority>span{font-size:12px!important} /* Modals in owners/users: bottom-sheet geometry. */ .app-shell :is(.owner-modal-card,.user-modal-card){width:100%!important;max-width:none!important;max-height:92svh!important;margin:auto 0 0!important;border-radius:22px 22px 0 0!important;padding:16px!important} } @media (max-width:520px){ .app-shell .page-content{padding-inline:12px!important} .app-shell .stat-grid,.app-shell .stat-grid.three,.app-shell .user-stat-grid{grid-template-columns:1fr!important} .app-shell .heading-actions,.app-shell .actions,.app-shell .hero-actions{grid-template-columns:1fr!important} .app-shell .owner-quick-info,.app-shell .owner-metrics,.app-shell .user-meta-grid,.app-shell .info-grid,.app-shell .owner-profile-stats{grid-template-columns:1fr!important} .app-shell .card-actions,.app-shell .user-card-actions,.app-shell .bank-card-actions{grid-template-columns:1fr!important} .quick-action-grid{grid-template-columns:1fr 1fr!important} .property-summary-grid{grid-template-columns:1fr 1fr!important} .season-rights-grid{grid-template-columns:1fr!important} .calendar-layer-checks{grid-template-columns:1fr!important} .calendar-week-head,.calendar-grid{min-width:735px!important} .calendar-day,.app-shell .calendar-day{min-height:128px!important} } @media (prefers-reduced-motion:reduce){ .app-shell *{scroll-behavior:auto!important} } /* Mobile readability floor for legacy micro-copy that used 8–11px sizes. */ @media (max-width:900px){ .app-shell :is( .status-chip,.period-type,.owner-metrics span,.owner-account span,.owner-account, .owner-quick-info,.user-meta-grid span,.user-meta-grid b,.user-role-row span, .role-card small,.permission-group>label,.permission-toolbar span,.group-toggle, .owner-picker-hint,.owner-selected-summary span,.owner-selected-summary small, #periodOwnerResults .owner-result-main small,#periodOwnerResults .owner-result em, #periodOwnerResults .owner-result-empty,#periodOwnerResults .owner-result-more, .stay-rate-card span,.stay-step-body header p,.switch-row small,.stay-allocation-preview, .stay-cost-preview span,.stay-cost-preview small,.stay-record-top p,.stay-record-grid small, .stay-override-note,.cleanup-preview span,.cleanup-preview li,.calendar-range-metrics small, .calendar-current-title small,.calendar-filters label>span:first-child,.calendar-text-link, .calendar-health span,.calendar-today-strip small,.calendar-source-stats span, .calendar-source-meta,.calendar-sync-alert span,.calendar-sync-alert small, .calendar-sync-form label span,.calendar-sync-message,.calendar-toggle-row small, .hijri-adjust-box>small,.selected-date-chip,.day-panel-summary small,.panel-section-head span, .booking-both-option small,.advice-metric span,.advice-warning,.advice-info ){ font-size:12px!important; line-height:1.7!important; font-weight:750!important; } .app-shell :is(.owner-result b,#periodOwnerResults .owner-result-main b,.stay-rate-card b,.stay-record-grid b,.calendar-source-stats b,.panel-section-head h3){font-size:13px!important;font-weight:850!important} .app-shell .status-chip{min-height:30px!important;padding:5px 9px!important;align-items:center!important} } /* ========================================================= ShareHome v12.1 — requested mobile interaction refinements 1) context-aware calendar navigation labels 2) square month cells on mobile 3) compact user/logout row in the drawer ========================================================= */ .calendar-period-nav{ display:grid!important; grid-template-columns:minmax(104px,1fr) auto minmax(104px,1fr)!important; gap:8px!important; align-items:center!important; } .calendar-period-nav .calendar-nav-labeled{ width:auto!important; min-width:0!important; padding:8px 12px!important; white-space:nowrap!important; font-weight:850!important; } .calendar-period-nav .calendar-today{min-width:76px!important;padding-inline:14px!important} .app-shell .sidebar-footer{padding-top:8px!important} .app-shell .sidebar-user-row{ display:grid!important; grid-template-columns:minmax(0,1fr) auto!important; align-items:center!important; gap:7px!important; width:100%!important; } .app-shell .sidebar-user-row .sidebar-account{ min-width:0!important; min-height:44px!important; padding:5px 7px!important; display:flex!important; align-items:center!important; gap:8px!important; } .app-shell .sidebar-user-row .sidebar-account .avatar{ width:36px!important;height:36px!important;flex:0 0 36px!important;border-radius:11px!important; } .app-shell .sidebar-user-row .account-copy{min-width:0!important;display:grid!important;gap:1px!important} .app-shell .sidebar-user-row .account-copy b, .app-shell .sidebar-user-row .account-copy small{overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important} .app-shell .sidebar-user-row .logout-link{ min-height:40px!important;height:40px!important; margin:0!important;padding:0 10px!important; display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:5px!important; border-radius:11px!important; white-space:nowrap!important; } .app-shell .sidebar-user-row .logout-link .icon{width:18px!important;height:18px!important} @media (max-width:900px){ .calendar-period-nav{ grid-template-columns:minmax(112px,1fr) 82px minmax(112px,1fr)!important; width:100%!important; } .calendar-period-nav .calendar-nav-labeled, .calendar-period-nav .calendar-today{ min-height:48px!important; font-size:max(13px,var(--ds-font-label))!important; } /* A month cell is a real square. The grid may scroll horizontally on narrow phones rather than stretching each day into a tall unusable rectangle. */ .calendar-board{ overflow-x:auto!important; overflow-y:hidden!important; overscroll-behavior-inline:contain!important; scrollbar-width:thin!important; } .calendar-week-head,.calendar-grid{ width:max(100%,560px)!important; min-width:560px!important; } .calendar-grid{align-items:stretch!important} .calendar-day,.app-shell .calendar-day,.calendar-day.empty{ min-height:0!important; height:auto!important; aspect-ratio:1 / 1!important; padding:7px!important; overflow:hidden!important; } .calendar-day-top{min-height:27px!important} .calendar-day-number{ width:30px!important;height:30px!important; font-size:max(14px,var(--ds-font-label))!important; } .calendar-day-items{ display:flex!important; flex-wrap:wrap!important; align-content:flex-start!important; gap:5px!important; margin-top:6px!important; } .calendar-day .day-item{ width:10px!important;height:10px!important;min-width:10px!important; padding:0!important;margin:0!important;border:0!important;border-radius:50%!important; background:transparent!important;overflow:visible!important; } .calendar-day .day-item>span{display:none!important} .calendar-day .day-item>i{width:9px!important;height:9px!important;flex:0 0 9px!important} .calendar-day .day-more{ width:auto!important; font-size:max(10px,var(--ds-font-caption))!important; line-height:1.3!important;padding:1px 3px!important; } .calendar-day .holiday-mark{ font-size:max(9px,calc(var(--ds-font-caption) * .85))!important; padding:2px 4px!important; } /* User identity and exit are one compact row in the mobile drawer. */ .app-shell .sidebar-footer{padding:8px 0 0!important;margin-top:auto!important} .app-shell .sidebar-user-row{gap:6px!important} .app-shell .sidebar-user-row .sidebar-account{min-height:46px!important;padding:4px 6px!important} .app-shell .sidebar-user-row .logout-link{min-height:42px!important;height:42px!important;padding-inline:9px!important} } @media (max-width:390px){ .calendar-period-nav{grid-template-columns:minmax(96px,1fr) 72px minmax(96px,1fr)!important;gap:6px!important} .calendar-period-nav .calendar-nav-labeled{padding-inline:7px!important} .calendar-week-head,.calendar-grid{width:525px!important;min-width:525px!important} .app-shell .sidebar-user-row .logout-link span{display:none!important} .app-shell .sidebar-user-row .logout-link{width:42px!important;padding:0!important} } /* ===== typography-central-v13.css ===== */ /* * ShareHome Central Typography v13 * Loaded last. This is the final authority for the three typography controls in Settings. * It replaces scattered fixed pixel sizes with title/body/meta tokens while preserving * minimum readable sizes on phones. */ :root{ --ty-body:calc(15px * var(--ds-body-scale,1)); --ty-label:calc(14px * var(--ds-body-scale,1)); --ty-title-xl:calc(30px * var(--ds-title-scale,1)); --ty-title-lg:calc(23px * var(--ds-title-scale,1)); --ty-title-md:calc(18px * var(--ds-title-scale,1)); --ty-title-sm:calc(15px * var(--ds-title-scale,1)); --ty-meta:calc(13px * var(--ds-meta-scale,1)); --ty-caption:calc(12px * var(--ds-meta-scale,1)); } body{font-size:var(--ty-body)!important} /* Titles: every page and component title follows the title control. */ h1,.app-shell h1,.page-heading h1,.ds-page-header h1,.users-heading h1, .dashboard-v11-head h1,.calendar-title-row h1,.calendar-settings-title h1, .settings-hero h1,.auth-card h2,.login-v4 h1,.login-v4 h2{ font-size:var(--ty-title-xl)!important;line-height:1.42!important;font-weight:900!important; } h2,.app-shell h2,.panel-head h2,.dashboard-section-title h2, .dashboard-schedule-panel .panel-head h2,.dashboard-attention-panel .panel-head h2, .dashboard-property-summary .panel-head h2,.dashboard-recent-activity .panel-head h2, .settings-section-head h2{ font-size:var(--ty-title-lg)!important;line-height:1.5!important;font-weight:900!important; } h3,.app-shell h3,.period-card h3,.owner-card-head h3,.account-main h3, .stay-step-body h3,.action-card h3{ font-size:var(--ty-title-md)!important;line-height:1.55!important;font-weight:900!important; } h4,h5,h6,.topbar-title>b,.brand strong,.user-panel b,.section-title b{ font-size:var(--ty-title-sm)!important;line-height:1.6!important;font-weight:850!important; } /* Normal copy, forms, buttons and tables follow the body control. */ p,li,td,dd,.button,button:not(.icon-button), input:not([type=checkbox]):not([type=radio]),select,textarea, .sidebar-nav a,.menu-section>span:not(.menu-open-mark):not(.nav-count), .section-hub-card-copy strong,.stay-step-body>p,.history-record-facts b,.history-detail-grid b{ font-size:var(--ty-body)!important; } label,.form-grid label,.auth-form label,.settings-field>span,.user-fields label,.owner-fields label, th,.ds-select-trigger,.ds-select-option{ font-size:var(--ty-label)!important; } /* Secondary text is intentionally a little heavier and never ghost-like. */ small,.small,.muted,.eyebrow,.form-hint,.field-help,.cell-note,.panel-kicker, .topbar-meta,.topbar-meta small,.topbar-title small,.brand span,.user-panel small, .panel-head p,.panel-head>a,.page-heading p,.ds-page-header p,.users-heading p, .status-chip,.ds-badge,.period-type,.period-card p,.day-more,.agenda-item small, .dashboard-v11-head p,.dashboard-kpi small,.dashboard-kpi p,.dashboard-section-title p, .quick-action-grid small,.timeline-date small,.timeline-copy small,.timeline-owner, .attention-list a,.property-summary-grid span,.recent-activity-grid small,.recent-activity-grid time, .owner-credit-ring span,.owner-season-grid small,.calendar-command-heading p,.calendar-cache-status, .calendar-mini-stats span,.calendar-mini-stats small,.calendar-filter-panel summary small, .calendar-filters label>span,.calendar-layer-checks label,.filter-check, .calendar-week-head span,.holiday-mark,.agenda-date span,.agenda-date small, .booking-mode-strip label>span,.booking-both-option small,.fairness-advice-head span, .advice-metric span,.advice-warning,.advice-info,.login-note,.login-copyright{ font-size:var(--ty-meta)!important; line-height:1.7!important; font-weight:700!important; } .field-error,.preview-label{font-size:var(--ty-caption)!important;font-weight:750!important} /* Component-specific emphasis still follows the appropriate central scale. */ .dashboard-kpi strong{font-size:calc(var(--ty-title-xl) * .95)!important} .quick-action-grid b,.timeline-copy b,.timeline-date b,.property-summary-grid b, .recent-activity-grid b,.owner-season-grid b,.agenda-item b{ font-size:var(--ty-label)!important;font-weight:900!important; } .kpi-icon,.quick-action-grid a>span{font-size:calc(var(--ty-title-md) * 1.05)!important} .calendar-day-number{font-size:var(--ty-label)!important} .day-item{font-size:var(--ty-caption)!important} /* The settings page itself must preview the same tokens it controls. */ .design-preview h3{font-size:var(--ty-title-md)!important} .design-preview p{font-size:var(--ty-body)!important} .design-preview small{font-size:var(--ty-meta)!important} @media(max-width:900px){ :root{ /* Keep the chosen scale, but enforce real mobile readability floors. */ --ty-body:max(14px,calc(15px * var(--ds-body-scale,1))); --ty-label:max(14px,calc(14px * var(--ds-body-scale,1))); --ty-title-xl:max(25px,calc(29px * var(--ds-title-scale,1))); --ty-title-lg:max(20px,calc(22px * var(--ds-title-scale,1))); --ty-title-md:max(17px,calc(18px * var(--ds-title-scale,1))); --ty-title-sm:max(15px,calc(15px * var(--ds-title-scale,1))); --ty-meta:max(12.5px,calc(13px * var(--ds-meta-scale,1))); --ty-caption:max(12px,calc(12px * var(--ds-meta-scale,1))); } input:not([type=checkbox]):not([type=radio]),select,textarea{font-size:max(16px,var(--ty-body))!important} .mobile-dock span{font-size:var(--ty-meta)!important;font-weight:800!important} .app-shell .sidebar-account b{font-size:var(--ty-label)!important} .app-shell .sidebar-account small{font-size:var(--ty-meta)!important} } /* ===== mobile-calendar-v14.css ===== */ /* * ShareHome Mobile Calendar v14 * Final calendar navigation + phone month-grid authority. * Loaded after typography-central so old min-width/scroll rules cannot win. */ /* The three period-navigation buttons are deliberately identical in geometry and type. Only the centre "today" action receives visual emphasis. */ .calendar-period-nav{ display:grid!important; grid-template-columns:repeat(3,minmax(0,1fr))!important; align-items:stretch!important; gap:8px!important; width:min(430px,100%)!important; direction:rtl!important; } .calendar-period-nav .calendar-nav-labeled, .calendar-period-nav .calendar-today{ width:100%!important; min-width:0!important; min-height:44px!important; height:44px!important; padding:0 10px!important; display:inline-flex!important; align-items:center!important; justify-content:center!important; border:1px solid #dce4ef!important; border-radius:11px!important; background:#fff!important; color:#4b5b70!important; box-shadow:none!important; font-size:var(--ty-label,14px)!important; font-weight:850!important; line-height:1.25!important; white-space:nowrap!important; text-align:center!important; } .calendar-period-nav .calendar-nav-labeled:hover{ background:#f8faff!important; border-color:#cdd9ed!important; color:#304b82!important; } .calendar-period-nav .calendar-today{ background:#eef3ff!important; border-color:#bdcdf5!important; color:#3658b1!important; box-shadow:0 6px 16px rgba(93,126,211,.12)!important; } .calendar-period-nav .calendar-today:hover{ background:#e7eeff!important; border-color:#aac0f3!important; } @media (max-width:900px){ /* Navigation stays one row, three equal touch targets. */ .calendar-period-nav{ width:100%!important; grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:7px!important; } .calendar-period-nav .calendar-nav-labeled, .calendar-period-nav .calendar-today{ min-height:48px!important; height:48px!important; padding:0 6px!important; border-radius:13px!important; font-size:var(--ty-label,14px)!important; font-weight:850!important; } /* Month view is a true seven-column phone calendar: no horizontal dragging. */ .calendar-board{ width:100%!important; max-width:100%!important; overflow:hidden!important; border-radius:18px!important; overscroll-behavior:auto!important; scroll-snap-type:none!important; } .calendar-week-head, .calendar-grid{ width:100%!important; min-width:0!important; max-width:100%!important; grid-template-columns:repeat(7,minmax(0,1fr))!important; } .calendar-week-head{ min-height:40px!important; background:#f8fafc!important; } .calendar-week-head>span{ min-width:0!important; min-height:40px!important; padding:0!important; display:grid!important; place-items:center!important; overflow:hidden!important; font-size:0!important; color:#68788d!important; font-weight:900!important; line-height:1!important; } .calendar-week-head>span::after{ font-size:13px!important; line-height:1!important; font-weight:900!important; } .calendar-week-head>span:nth-child(1)::after{content:"ش"} .calendar-week-head>span:nth-child(2)::after{content:"ی"} .calendar-week-head>span:nth-child(3)::after{content:"د"} .calendar-week-head>span:nth-child(4)::after{content:"س"} .calendar-week-head>span:nth-child(5)::after{content:"چ"} .calendar-week-head>span:nth-child(6)::after{content:"پ"} .calendar-week-head>span:nth-child(7)::after{content:"ج"} .calendar-week-head>span.friday{color:#a45e62!important;background:#fff8f8!important} .calendar-grid{ display:grid!important; align-items:stretch!important; gap:1px!important; background:#e7ecf2!important; } .calendar-day, .app-shell .calendar-day, .calendar-day.empty{ position:relative!important; width:100%!important; min-width:0!important; min-height:0!important; height:auto!important; aspect-ratio:1 / 1!important; padding:4px!important; margin:0!important; overflow:hidden!important; border:0!important; border-radius:0!important; background:#fff!important; box-shadow:none!important; scroll-snap-align:none!important; touch-action:manipulation!important; } .calendar-day:nth-child(7n), .calendar-day.empty:nth-child(7n){background:#fffafa!important} .calendar-day.empty{background:#fafbfd!important} .calendar-day.empty:nth-child(7n){background:#fff8f8!important} .calendar-day:hover,.app-shell .calendar-day:hover{background:#f8faff!important;box-shadow:none!important} .calendar-day:nth-child(7n):hover{background:#fff5f5!important} .calendar-day.focused{ z-index:1!important; box-shadow:inset 0 0 0 2px #b7c8f3!important; background:#f8faff!important; } .calendar-day.today{ z-index:2!important; box-shadow:inset 0 0 0 2px #6c89d9!important; } .calendar-day-top{ min-height:26px!important; height:26px!important; display:flex!important; align-items:center!important; justify-content:center!important; margin:0!important; } .calendar-day-number{ width:26px!important; height:26px!important; display:grid!important; place-items:center!important; border-radius:9px!important; color:#2f4057!important; background:transparent!important; font-size:15px!important; font-weight:900!important; line-height:1!important; } .calendar-day.today .calendar-day-number{ background:#5f7fd1!important; color:#fff!important; } .calendar-day.focused:not(.today) .calendar-day-number{ background:#eef3ff!important; color:#3658b1!important; } /* Holiday is a discreet status dot; text belongs in the day bottom sheet. */ .calendar-day .holiday-mark{ position:absolute!important; top:5px!important; left:5px!important; width:7px!important; height:7px!important; min-width:7px!important; padding:0!important; margin:0!important; border:1px solid #efcaca!important; border-radius:50%!important; background:#e99b9b!important; color:transparent!important; font-size:0!important; line-height:0!important; overflow:hidden!important; } /* Only compact status dots live inside a month cell. Full text opens on tap. */ .calendar-day-items{ position:absolute!important; left:4px!important; right:4px!important; bottom:5px!important; min-height:9px!important; margin:0!important; display:flex!important; flex-direction:row!important; flex-wrap:nowrap!important; align-items:center!important; justify-content:center!important; gap:3px!important; overflow:hidden!important; } .calendar-day .day-item{ display:inline-grid!important; place-items:center!important; width:8px!important; height:8px!important; min-width:8px!important; max-width:8px!important; padding:0!important; margin:0!important; border:0!important; border-radius:50%!important; background:transparent!important; overflow:hidden!important; box-shadow:none!important; } .calendar-day .day-item>span{display:none!important} .calendar-day .day-item>i{ display:block!important; width:7px!important; height:7px!important; min-width:7px!important; flex:0 0 7px!important; border-radius:50%!important; } .calendar-day .day-more{ display:inline-flex!important; align-items:center!important; justify-content:center!important; width:auto!important; min-width:12px!important; height:12px!important; padding:0 2px!important; margin:0!important; border-radius:6px!important; background:#f0f3f7!important; color:#64748b!important; font-size:0!important; line-height:1!important; font-weight:900!important; } .calendar-day .day-more::after{ content:"+" attr(data-count)!important; font-size:9px!important; line-height:1!important; } /* Day details already use the calendar drawer; make the mobile sheet unmistakable. */ .calendar-overlay.calendar-drawer-overlay{ align-items:flex-end!important; justify-content:stretch!important; padding:0!important; } .calendar-day-panel.calendar-drawer{ width:100%!important; max-width:none!important; max-height:84svh!important; border-radius:22px 22px 0 0!important; padding-bottom:calc(18px + env(safe-area-inset-bottom))!important; } } @media (max-width:390px){ .calendar-period-nav{gap:5px!important} .calendar-period-nav .calendar-nav-labeled, .calendar-period-nav .calendar-today{ padding:0 4px!important; font-size:13px!important; } .calendar-week-head>span::after{font-size:12.5px!important} .calendar-day-number{width:24px!important;height:24px!important;font-size:14px!important} .calendar-day-top{height:24px!important;min-height:24px!important} .calendar-day-items{bottom:4px!important;gap:2px!important} .calendar-day .day-item{width:7px!important;height:7px!important;min-width:7px!important;max-width:7px!important} .calendar-day .day-item>i{width:6px!important;height:6px!important;min-width:6px!important;flex-basis:6px!important} } /* ===== calendar-views-v15.css ===== */ /* * ShareHome Calendar Views v15 * Separate renderers for week/day/30-day/agenda views. * Loaded after mobile-calendar-v14 so this file is the final authority for non-month views. */ .calendar-view-shell{ border:1px solid #e3e9f1; border-radius:20px; background:#fff; box-shadow:0 12px 30px rgba(31,47,70,.045); overflow:hidden; } .calendar-view-heading{ display:flex; align-items:flex-start; justify-content:space-between; gap:18px; padding:18px 20px; border-bottom:1px solid #e8edf3; background:linear-gradient(180deg,#fff 0%,#fbfcff 100%); } .calendar-view-heading h2{margin:3px 0 0!important;font-size:1.22rem!important;color:#24344b!important} .calendar-view-heading>small{color:#7b899a!important;line-height:1.8!important;max-width:360px} /* Week: a genuine seven-column planning grid on desktop. */ .calendar-week-view-grid{ display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:0; background:#e8edf3; } .week-view-day{ appearance:none; min-width:0; min-height:320px; padding:0; border:0; border-left:1px solid #e8edf3; background:#fff; color:#27384f; text-align:right; cursor:pointer; display:flex; flex-direction:column; transition:background .15s ease,box-shadow .15s ease; } .week-view-day:last-child{border-left:0} .week-view-day:hover{background:#fbfcff;box-shadow:inset 0 0 0 2px #e3eaff} .week-view-day.today{background:#f7f9ff;box-shadow:inset 0 3px 0 #6684d5} .week-view-day.holiday{background:#fffafa} .week-view-date{ display:grid; gap:2px; justify-items:center; min-height:92px; padding:14px 8px 12px; border-bottom:1px solid #edf1f5; } .week-view-date small{font-weight:850!important;color:#6b7a8e!important} .week-view-date strong{font-size:1.55rem!important;line-height:1.15;color:#25374f} .week-view-date span{font-size:.82rem!important;color:#8793a3!important} .week-view-items{display:grid;gap:7px;padding:12px 9px;align-content:start} .week-view-item{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:2px 7px; align-items:start; padding:8px 9px; border:1px solid #edf1f6; border-radius:11px; background:#fafbfd; } .week-view-item>i{grid-row:1/3;width:7px;height:7px;border-radius:50%;margin-top:6px;background:#aab4c0} .week-view-item b{min-width:0;font-size:.8rem!important;line-height:1.65;color:#33445b;white-space:normal} .week-view-item small{font-size:.72rem!important;color:#8290a0!important} .week-view-item.occasion{background:#fffaf0;border-color:#f1e7ca}.week-view-item.occasion>i{background:#c9a45c} .week-view-item.period{background:#f4f9fc;border-color:#dcecf5}.week-view-item.period>i{background:#70afd4} .week-view-item.event{background:#f8f6ff;border-color:#e8e1fb}.week-view-item.event>i{background:#8b79cf} .week-view-empty{padding:18px 6px;text-align:center;color:#9aa5b3;font-size:.78rem!important} .week-view-more{padding:5px 7px;text-align:center;color:#67768a;font-size:.72rem!important;font-weight:800} /* Day: one focused day with three semantic sections. */ .day-view-heading{align-items:center} .day-view-counters{display:flex;gap:8px;flex-wrap:wrap} .day-view-counters span{ display:inline-flex;align-items:center;gap:6px; padding:7px 10px;border:1px solid #e4eaf2;border-radius:999px;background:#fff; color:#68788d;font-size:.78rem!important;font-weight:800; } .day-view-counters i,.next30-counts i{ width:7px;height:7px;border-radius:50%;display:inline-block; } .day-view-counters .occasion,.next30-counts .occasion{background:#c9a45c} .day-view-counters .period,.next30-counts .period{background:#70afd4} .day-view-counters .event,.next30-counts .event{background:#8b79cf} .day-view-sections{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding:18px} .day-view-section{ border:1px solid #e6ebf2;border-radius:16px;background:#fbfcfe;padding:15px;min-width:0; } .day-view-section h3{display:flex;align-items:center;gap:8px;margin:0 0 12px!important;font-size:.95rem!important} .day-view-section h3 i{width:9px;height:9px;border-radius:50%;display:inline-block} .day-view-section h3 i.occasion{background:#c9a45c}.day-view-section h3 i.period{background:#70afd4}.day-view-section h3 i.event{background:#8b79cf} .day-view-record{display:grid;gap:3px;padding:10px 0;border-bottom:1px solid #edf1f5} .day-view-record:last-child{border-bottom:0} .day-view-record b{font-size:.88rem!important;line-height:1.75;color:#304159} .day-view-record small{font-size:.76rem!important;color:#7f8c9c!important} .day-view-empty{margin:0;padding:18px 8px;text-align:center;color:#98a3b1;font-size:.78rem!important} /* 30-day: dense overview instead of oversized agenda rows. */ .next30-grid{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; padding:14px; background:#fafbfd; } .next30-day{ appearance:none;min-width:0;min-height:128px;padding:12px; border:1px solid #e4eaf2;border-radius:15px;background:#fff;color:#2d3e55; text-align:right;display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px; cursor:pointer;transition:transform .14s ease,border-color .14s ease,box-shadow .14s ease; } .next30-day:hover{transform:translateY(-2px);border-color:#cfdaf0;box-shadow:0 10px 24px rgba(31,47,70,.07)} .next30-day.today{border-color:#b9c8ed;background:#f8faff} .next30-day.holiday{background:#fffafa} .next30-day.quiet{background:#fcfdfd} .next30-date{display:grid;align-content:start;justify-items:center;min-width:48px;padding-left:10px;border-left:1px solid #edf1f5} .next30-date strong{font-size:1.45rem!important;line-height:1;color:#283a52} .next30-date span{font-size:.78rem!important;margin-top:6px;color:#4d5d71} .next30-date small{font-size:.7rem!important;color:#8c98a7!important} .next30-summary{display:grid;align-content:start;gap:9px;min-width:0} .next30-counts{display:flex;align-items:center;gap:5px;color:#64748b} .next30-counts b{font-size:.76rem!important;margin-left:4px} .next30-summary em{font-style:normal;font-size:.78rem!important;line-height:1.7;color:#4c5d72;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical} .next30-summary em.free{color:#9aa5b3} /* Agenda: compact records only, intentionally different from week/day/30-day. */ .agenda-compact-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:14px;background:#fafbfd} .agenda-compact-day{ display:grid;grid-template-columns:78px minmax(0,1fr);min-width:0; border:1px solid #e4eaf2;border-radius:14px;background:#fff;overflow:hidden;cursor:pointer; } .agenda-compact-day.holiday{border-right:3px solid #d98787} .agenda-compact-date{display:grid;place-items:center;align-content:center;gap:2px;padding:12px 8px;background:#f8fafc;border-left:1px solid #edf1f5} .agenda-compact-date strong{font-size:1.4rem!important;color:#2d3f57}.agenda-compact-date span{font-size:.78rem!important}.agenda-compact-date small{font-size:.7rem!important;color:#8b98a8!important} .agenda-compact-records{display:grid;padding:9px 12px;align-content:start} .agenda-compact-record{display:grid;grid-template-columns:auto minmax(0,1fr);gap:2px 7px;padding:7px 0;border-bottom:1px solid #f0f3f6;min-width:0} .agenda-compact-record:last-child{border-bottom:0} .agenda-compact-record i{grid-row:1/3;width:7px;height:7px;border-radius:50%;margin-top:7px;background:#aab4c0} .agenda-compact-record b{font-size:.8rem!important;line-height:1.65;color:#34465e;white-space:normal} .agenda-compact-record small{font-size:.72rem!important;color:#8491a1!important} .agenda-compact-record.occasion i{background:#c9a45c}.agenda-compact-record.period i{background:#70afd4}.agenda-compact-record.event i{background:#8b79cf} @media(max-width:1180px){ .next30-grid{grid-template-columns:repeat(4,minmax(0,1fr))} .calendar-week-view-grid{overflow:auto;grid-template-columns:repeat(7,minmax(180px,1fr))} } @media(max-width:900px){ .calendar-view-shell{border-radius:18px} .calendar-view-heading{padding:15px 16px;display:grid;gap:8px} .calendar-view-heading>small{max-width:none} .calendar-week-view-grid{ display:flex;overflow-x:auto;gap:10px;padding:12px;background:#fafbfd; scroll-snap-type:x mandatory;overscroll-behavior-inline:contain; } .week-view-day{ flex:0 0 min(78vw,360px);min-height:250px;border:1px solid #e4eaf2!important;border-radius:16px;overflow:hidden; scroll-snap-align:center; } .week-view-date{min-height:74px;grid-template-columns:auto auto auto;justify-content:center;align-items:center;gap:8px;padding:10px} .week-view-date strong{font-size:1.35rem!important}.week-view-date span,.week-view-date small{font-size:.82rem!important} .week-view-items{padding:10px} .day-view-counters{width:100%} .day-view-sections{grid-template-columns:1fr;padding:12px;gap:10px} .day-view-section{padding:13px} .next30-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:10px} .next30-day{min-height:118px;padding:10px;grid-template-columns:auto 1fr} .agenda-compact-list{grid-template-columns:1fr;padding:10px} .agenda-compact-day{grid-template-columns:72px 1fr} .calendar-view-shell{margin-bottom:calc(86px + env(safe-area-inset-bottom))} } @media(max-width:520px){ .next30-grid{grid-template-columns:1fr 1fr} .next30-day{min-height:112px;gap:7px} .next30-date{min-width:42px;padding-left:7px} .next30-date strong{font-size:1.3rem!important} .next30-summary em{font-size:.76rem!important} } @media(max-width:390px){ .next30-grid{grid-template-columns:1fr} .next30-day{min-height:96px} } /* ===== calendar-professional-v16.css ===== */ /* * Hammelk Calendar Professional v16 * White-first, calm accent design inspired by mature consumer apps: * strong hierarchy, restrained colour, calendar-native layouts and mobile-first week navigation. * Loaded last and intentionally overrides older calendar layers. */ :root{ --cal16-bg:#ffffff; --cal16-surface:#ffffff; --cal16-soft:#f7f9fc; --cal16-line:#e3e9f1; --cal16-line-strong:#d6dfeb; --cal16-text:#26384f; --cal16-muted:#758399; --cal16-accent:#5f7fd1; --cal16-accent-soft:#eef3ff; --cal16-occasion:#c9a45c; --cal16-period:#70afd4; --cal16-event:#8a77cf; --cal16-danger:#cf7479; --cal16-shadow:0 10px 30px rgba(31,47,70,.055); } /* ---------- Shared calendar surfaces ---------- */ #main-content .professional-calendar .calendar-view-shell, #main-content .professional-calendar .calendar-board{ background:var(--cal16-surface)!important; border:1px solid var(--cal16-line)!important; border-radius:20px!important; box-shadow:var(--cal16-shadow)!important; overflow:hidden!important; } #main-content .professional-calendar .cal16-view-heading{ display:flex!important; align-items:flex-start!important; justify-content:space-between!important; gap:18px!important; padding:17px 20px!important; border-bottom:1px solid var(--cal16-line)!important; background:#fff!important; } #main-content .professional-calendar .cal16-view-heading h2{ margin:3px 0 0!important; color:var(--cal16-text)!important; font-size:1.18rem!important; font-weight:900!important; } #main-content .professional-calendar .cal16-view-heading>small{ color:var(--cal16-muted)!important; font-weight:700!important; line-height:1.8!important; } /* neutralize the legacy global button fill for calendar content controls */ #main-content .professional-calendar button.cal16-week-column-head, #main-content .professional-calendar button.cal16-week-tab, #main-content .professional-calendar button.cal16-detail-action, #main-content .professional-calendar button.cal16-more-button, #main-content .professional-calendar button.cal16-rolling-day, #main-content .professional-calendar button.cal16-agenda-date{ background:#fff!important; color:var(--cal16-text)!important; border-color:var(--cal16-line)!important; box-shadow:none!important; } /* ---------- Month: keep it recognisably calendar-like ---------- */ #main-content .professional-calendar .calendar-week-head{ background:#f8fafc!important; border-bottom:1px solid var(--cal16-line)!important; } #main-content .professional-calendar .calendar-grid{ background:var(--cal16-line)!important; gap:1px!important; } #main-content .professional-calendar .calendar-grid button.calendar-day{ background:#fff!important; color:var(--cal16-text)!important; border:0!important; box-shadow:none!important; } #main-content .professional-calendar .calendar-grid button.calendar-day:hover{background:#fafcff!important} #main-content .professional-calendar .calendar-grid button.calendar-day.today{background:#f8faff!important;box-shadow:inset 0 0 0 2px #b9c8ed!important} #main-content .professional-calendar .calendar-grid button.calendar-day.holiday{background:#fffafa!important} /* ---------- Week desktop: seven real calendar columns ---------- */ .cal16-week-desktop{ display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); background:var(--cal16-line); gap:1px; } .cal16-week-column{ min-width:0; min-height:340px; background:#fff; display:flex; flex-direction:column; } .cal16-week-column.today{box-shadow:inset 0 3px 0 var(--cal16-accent)} .cal16-week-column.holiday{background:#fffafa} #main-content .professional-calendar .cal16-week-column-head{ width:100%!important; min-height:92px!important; padding:12px 8px!important; border:0!important; border-bottom:1px solid #edf1f5!important; border-radius:0!important; display:grid!important; justify-items:center!important; align-content:center!important; gap:1px!important; cursor:pointer!important; transition:background .15s ease!important; } #main-content .professional-calendar .cal16-week-column-head:hover{background:#f9fbff!important} .cal16-week-column-head small{font-size:.78rem!important;color:#6e7d91!important;font-weight:850!important} .cal16-week-column-head strong{font-size:1.5rem!important;line-height:1.15;color:#26384f} .cal16-week-column-head span{font-size:.78rem!important;color:#8a97a7!important} .cal16-week-column-body{display:grid;align-content:start;gap:7px;padding:10px} .cal16-entry{ min-width:0; display:grid; grid-template-columns:auto minmax(0,1fr); gap:2px 8px; align-items:start; padding:9px 10px; border:1px solid #e8edf3; border-radius:11px; background:#fff; } .cal16-entry>i{ grid-row:1/3; width:7px;height:7px;border-radius:50%;margin-top:7px; background:#aab4c0; } .cal16-entry>span{display:grid;gap:2px;min-width:0} .cal16-entry b{font-size:.82rem!important;line-height:1.65;color:#33455d;white-space:normal} .cal16-entry small{font-size:.73rem!important;line-height:1.6;color:#8793a2!important;font-weight:700!important} .cal16-entry.occasion>i{background:var(--cal16-occasion)} .cal16-entry.period>i{background:var(--cal16-period)} .cal16-entry.event>i{background:var(--cal16-event)} .cal16-empty-day{padding:24px 6px;text-align:center;color:#a0aab7;font-size:.78rem!important;font-weight:700} #main-content .professional-calendar .cal16-more-button{ width:100%!important;min-height:34px!important;padding:7px!important;border:1px dashed #dbe3ed!important;border-radius:9px!important; color:#68788d!important;font-size:.74rem!important;font-weight:800!important; } .cal16-week-mobile{display:none} /* ---------- Day: quiet vertical timeline ---------- */ .cal16-day-heading{align-items:center!important} .cal16-day-metrics{display:flex;flex-wrap:wrap;gap:8px} .cal16-day-metrics span{ display:inline-flex;align-items:center;gap:6px;min-height:34px;padding:6px 10px; border:1px solid var(--cal16-line);border-radius:999px;background:#fff; color:#68788d;font-size:.76rem!important;font-weight:800; } .cal16-day-metrics i,.cal16-rolling-dots i{width:7px;height:7px;border-radius:50%;display:inline-block} .cal16-day-metrics i.occasion,.cal16-rolling-dots i.occasion{background:var(--cal16-occasion)} .cal16-day-metrics i.period,.cal16-rolling-dots i.period{background:var(--cal16-period)} .cal16-day-metrics i.event,.cal16-rolling-dots i.event{background:var(--cal16-event)} .cal16-day-timeline{position:relative;padding:18px 22px 24px;background:#fff} .cal16-day-timeline:before{content:"";position:absolute;right:38px;top:28px;bottom:28px;width:1px;background:#e5ebf2} .cal16-timeline-row{position:relative;display:grid;grid-template-columns:34px minmax(0,1fr);gap:12px;padding:10px 0} .cal16-timeline-mark{position:relative;z-index:1;display:grid;place-items:center} .cal16-timeline-mark:before{content:"";width:17px;height:17px;border-radius:50%;background:#fff;border:1px solid #dfe6ef;box-shadow:0 0 0 5px #fff} .cal16-timeline-mark i{position:absolute;width:7px;height:7px;border-radius:50%;background:#aab4c0} .cal16-timeline-row.occasion .cal16-timeline-mark i{background:var(--cal16-occasion)} .cal16-timeline-row.period .cal16-timeline-mark i{background:var(--cal16-period)} .cal16-timeline-row.event .cal16-timeline-mark i{background:var(--cal16-event)} .cal16-timeline-row>div{padding:10px 13px;border:1px solid #e8edf3;border-radius:13px;background:#fff} .cal16-timeline-row>div>small{display:block;margin-bottom:3px;color:#8b97a6!important;font-size:.72rem!important;font-weight:800!important} .cal16-timeline-row>div>b{display:block;color:#304159;font-size:.9rem!important;line-height:1.75} .cal16-timeline-row>div>p{margin:3px 0 0;color:#76859a;font-size:.78rem!important;line-height:1.7;font-weight:700} .cal16-day-empty{margin:8px 0;padding:34px 18px;text-align:center;border:1px dashed #dce4ed;border-radius:14px;background:#fbfcfe;color:#7d8a9c} .cal16-day-empty b{display:block;color:#53647a;margin-bottom:5px}.cal16-day-empty span{font-size:.8rem!important} /* ---------- Rolling 30-day calendar ---------- */ .cal16-rolling-week-head{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));background:#f8fafc;border-bottom:1px solid var(--cal16-line)} .cal16-rolling-week-head span{padding:10px 4px;text-align:center;color:#758399;font-size:.76rem!important;font-weight:850} .cal16-rolling-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:1px;background:var(--cal16-line)} .cal16-rolling-empty{min-height:118px;background:#fafbfd} #main-content .professional-calendar .cal16-rolling-day{ position:relative!important;min-width:0!important;min-height:118px!important;padding:10px!important;border:0!important;border-radius:0!important; display:flex!important;flex-direction:column!important;align-items:stretch!important;justify-content:flex-start!important;gap:8px!important;text-align:right!important; cursor:pointer!important;transition:background .14s ease!important; } #main-content .professional-calendar .cal16-rolling-day:hover{background:#fafcff!important} #main-content .professional-calendar .cal16-rolling-day.today{background:#f8faff!important;box-shadow:inset 0 0 0 2px #b9c8ed!important} #main-content .professional-calendar .cal16-rolling-day.holiday{background:#fffafa!important} .cal16-rolling-top{display:flex;align-items:baseline;gap:5px} .cal16-rolling-top b{font-size:1rem!important;color:#2f4058}.cal16-rolling-top small{font-size:.68rem!important;color:#8b98a7!important;font-weight:750} .cal16-rolling-preview{min-height:34px}.cal16-rolling-preview em{font-style:normal;color:#596a80;font-size:.75rem!important;line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.cal16-rolling-preview em.free{color:#a0aab7} .cal16-rolling-dots{margin-top:auto;display:flex;align-items:center;gap:4px;min-height:12px}.cal16-rolling-dots small{margin-right:auto;color:#7e8b9c!important;font-size:.67rem!important;font-weight:900} /* ---------- Agenda ---------- */ .cal16-agenda-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:14px;background:#fafbfd} .cal16-agenda-day{display:grid;grid-template-columns:78px minmax(0,1fr);border:1px solid #e3e9f1;border-radius:14px;background:#fff;overflow:hidden;min-width:0} .cal16-agenda-day.holiday{border-right:3px solid #e0a0a4} #main-content .professional-calendar .cal16-agenda-date{ min-height:100%!important;padding:12px 8px!important;border:0!important;border-left:1px solid #edf1f5!important;border-radius:0!important;background:#f9fafc!important; display:grid!important;place-items:center!important;align-content:center!important;gap:2px!important;cursor:pointer!important; } .cal16-agenda-date strong{font-size:1.35rem!important;color:#304159}.cal16-agenda-date span{font-size:.76rem!important;color:#5f6f83}.cal16-agenda-date small{font-size:.7rem!important;color:#8b98a7!important} .cal16-agenda-records{display:grid;align-content:start;gap:6px;padding:9px} .cal16-agenda-records .cal16-entry{padding:7px 8px;border-radius:9px} /* ---------- Mobile-first professional week ---------- */ @media(max-width:900px){ #main-content .professional-calendar .calendar-view-shell{border-radius:18px!important;margin-bottom:calc(94px + env(safe-area-inset-bottom))!important} #main-content .professional-calendar .cal16-view-heading{padding:14px 15px!important;display:grid!important;gap:4px!important} #main-content .professional-calendar .cal16-view-heading>small{font-size:.78rem!important} .cal16-week-desktop{display:none!important} .cal16-week-mobile{display:block!important;background:#fff} .cal16-week-strip{ display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px;padding:10px; border-bottom:1px solid var(--cal16-line);background:#fff; } #main-content .professional-calendar .cal16-week-tab{ position:relative!important;min-width:0!important;min-height:62px!important;padding:6px 2px!important;border:1px solid transparent!important;border-radius:12px!important; display:grid!important;place-items:center!important;align-content:center!important;gap:1px!important;cursor:pointer!important; } #main-content .professional-calendar .cal16-week-tab small{font-size:.75rem!important;color:#8390a1!important;font-weight:850!important} #main-content .professional-calendar .cal16-week-tab strong{font-size:1rem!important;color:#34465d!important;line-height:1.2} #main-content .professional-calendar .cal16-week-tab>i{position:absolute;bottom:5px;width:5px;height:5px;border-radius:50%;background:var(--cal16-occasion)} #main-content .professional-calendar .cal16-week-tab.is-active{background:var(--cal16-accent-soft)!important;border-color:#d7e1fb!important;color:#3456ad!important} #main-content .professional-calendar .cal16-week-tab.is-active strong{color:#3456ad!important} #main-content .professional-calendar .cal16-week-tab.today:not(.is-active){border-color:#dce4ef!important;background:#fbfcff!important} #main-content .professional-calendar .cal16-week-tab.holiday small{color:#b46b70!important} .cal16-week-panels{padding:0 12px 14px} .cal16-week-panel{padding-top:12px} .cal16-week-panel[hidden]{display:none!important} .cal16-mobile-day-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:4px 2px 12px} .cal16-mobile-day-head>div{display:grid;gap:2px}.cal16-mobile-day-head b{font-size:.98rem;color:#2f4058}.cal16-mobile-day-head small{font-size:.75rem!important;color:#8794a5!important;font-weight:750} #main-content .professional-calendar .cal16-detail-action{min-height:36px!important;padding:7px 10px!important;border:1px solid #dfe6ef!important;border-radius:10px!important;color:#52637a!important;font-size:.76rem!important;font-weight:850!important} .cal16-mobile-agenda{display:grid;gap:8px} .cal16-mobile-agenda .cal16-entry{padding:11px 12px;border-radius:12px} .cal16-mobile-agenda .cal16-entry b{font-size:.9rem!important} .cal16-mobile-agenda .cal16-entry small{font-size:.78rem!important} .cal16-mobile-empty{padding:34px 15px;text-align:center;border:1px dashed #dce4ed;border-radius:14px;background:#fbfcfe;color:#8190a2} .cal16-mobile-empty b{display:block;color:#53647a;margin-bottom:4px}.cal16-mobile-empty span{font-size:.8rem!important} /* Day timeline remains one clean vertical stream on phone. */ .cal16-day-heading{align-items:start!important}.cal16-day-metrics{margin-top:6px}.cal16-day-metrics span{font-size:.76rem!important} .cal16-day-timeline{padding:12px 14px 16px}.cal16-day-timeline:before{right:28px}.cal16-timeline-row{grid-template-columns:28px 1fr;gap:9px;padding:6px 0}.cal16-timeline-row>div{padding:11px 12px}.cal16-timeline-row>div>b{font-size:.92rem!important}.cal16-timeline-row>div>p{font-size:.78rem!important} /* 30-day stays calendar-like on mobile: seven equal columns, text collapses to status dots. */ .cal16-rolling-week-head span{font-size:0!important;padding:8px 1px!important}.cal16-rolling-week-head span:after{font-size:.72rem!important;font-weight:900!important;color:#7b899b} .cal16-rolling-week-head span:nth-child(1):after{content:"ش"}.cal16-rolling-week-head span:nth-child(2):after{content:"ی"}.cal16-rolling-week-head span:nth-child(3):after{content:"د"}.cal16-rolling-week-head span:nth-child(4):after{content:"س"}.cal16-rolling-week-head span:nth-child(5):after{content:"چ"}.cal16-rolling-week-head span:nth-child(6):after{content:"پ"}.cal16-rolling-week-head span:nth-child(7):after{content:"ج"} .cal16-rolling-empty{min-height:70px} #main-content .professional-calendar .cal16-rolling-day{min-height:70px!important;aspect-ratio:1/1!important;padding:5px!important;gap:2px!important;justify-content:flex-start!important} .cal16-rolling-top{justify-content:center}.cal16-rolling-top b{font-size:.9rem!important}.cal16-rolling-top small{display:none!important}.cal16-rolling-preview{display:none!important}.cal16-rolling-dots{margin-top:auto!important;justify-content:center!important;gap:3px!important}.cal16-rolling-dots i{width:6px;height:6px}.cal16-rolling-dots small{margin:0!important;font-size:.58rem!important} /* Agenda becomes a single clean list. */ .cal16-agenda-list{grid-template-columns:1fr;padding:10px;gap:8px}.cal16-agenda-day{grid-template-columns:68px minmax(0,1fr)} .cal16-agenda-records .cal16-entry b{font-size:.86rem!important}.cal16-agenda-records .cal16-entry small{font-size:.76rem!important} /* Month: force true compact seven-column cells despite older mobile layers. */ #main-content .professional-calendar .calendar-board{overflow:hidden!important;width:100%!important} #main-content .professional-calendar .calendar-week-head, #main-content .professional-calendar .calendar-grid{min-width:0!important;width:100%!important;grid-template-columns:repeat(7,minmax(0,1fr))!important} #main-content .professional-calendar .calendar-grid button.calendar-day, #main-content .professional-calendar .calendar-grid .calendar-day.empty{ min-width:0!important;min-height:0!important;height:auto!important;aspect-ratio:1/1!important;padding:4px!important; } } @media(max-width:420px){ .cal16-week-strip{gap:3px;padding:9px 7px} #main-content .professional-calendar .cal16-week-tab{min-height:58px!important;border-radius:10px!important} #main-content .professional-calendar .cal16-week-tab small{font-size:.71rem!important} #main-content .professional-calendar .cal16-week-tab strong{font-size:.94rem!important} .cal16-week-panels{padding:0 9px 12px} } /* ===== hammelk-v22.css ===== */ /* هم‌ملک v22 — گروه‌های ویژه، خوش‌آمد هوشمند و اطلاع‌رسانی */ .smart-welcome{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:center;margin:0 0 22px;padding:25px 28px;border:1px solid rgba(255,255,255,.18);border-radius:24px;background:linear-gradient(125deg,#173c34 0%,#245d50 56%,#2f7b68 100%);color:#fff;box-shadow:0 18px 44px rgba(24,72,58,.18)} .smart-welcome::after{content:"";position:absolute;inset:-70px -30px auto auto;width:250px;height:250px;border-radius:50%;background:rgba(255,255,255,.06);pointer-events:none} .smart-welcome.management{background:linear-gradient(125deg,#173848,#28566e 58%,#347592 100%)} .smart-welcome-main{position:relative;z-index:1;min-width:0}.smart-welcome-kicker{display:inline-flex;margin-bottom:7px;padding:5px 10px;border:1px solid rgba(255,255,255,.2);border-radius:999px;background:rgba(255,255,255,.09);font-size:11px;font-weight:900}.smart-welcome h2{margin:0 0 5px;color:#fff;font-size:25px;line-height:1.5}.smart-welcome p{margin:0;color:rgba(255,255,255,.78);font-weight:600}.smart-welcome-summary{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,minmax(112px,1fr));gap:9px}.smart-welcome-summary a{display:grid;gap:2px;padding:13px 14px;border:1px solid rgba(255,255,255,.13);border-radius:16px;background:rgba(255,255,255,.08);color:#fff;text-decoration:none;backdrop-filter:blur(5px)}.smart-welcome-summary b{font-size:22px}.smart-welcome-summary span{font-size:11px;color:rgba(255,255,255,.77)} .smart-alert-list{position:relative;z-index:1;display:grid;gap:8px;min-width:min(520px,48vw)}.smart-alert{display:grid;grid-template-columns:32px minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 11px;border:1px solid rgba(255,255,255,.15);border-radius:14px;background:rgba(255,255,255,.1)}.smart-alert-icon{width:30px;height:30px;display:grid;place-items:center;border-radius:10px;background:rgba(255,255,255,.14);font-weight:900}.smart-alert div{display:grid}.smart-alert b{font-size:12.5px}.smart-alert small{color:rgba(255,255,255,.75);font-size:10.5px}.smart-alert a{padding:7px 9px;border-radius:9px;background:#fff;color:#23584c;text-decoration:none;font-size:10.5px;font-weight:900}.smart-welcome-ok{position:relative;z-index:1;display:flex;gap:11px;align-items:center;padding:12px 15px;border-radius:16px;background:rgba(255,255,255,.1)}.smart-welcome-ok>span{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:#fff;color:#1d715d;font-weight:900}.smart-welcome-ok div{display:grid}.smart-welcome-ok small{color:rgba(255,255,255,.76)} .owner-dashboard-actions .special-lottery-action{background:linear-gradient(135deg,#7d5d17,#a47b22)!important;color:#fff!important;border-color:transparent!important;box-shadow:0 9px 22px rgba(132,96,20,.18)} /* نوار اطلاع‌رسانی سراسری */ .global-announcements{position:relative;z-index:25;display:grid;gap:3px;padding:0 18px;background:#fff}.global-announcement{min-height:38px;display:flex;align-items:center;gap:10px;padding:7px 14px;border:1px solid #dceae5;border-radius:0 0 13px 13px;background:linear-gradient(90deg,#f4fbf8,#fff);color:#26483f;overflow:hidden}.global-announcement__badge{flex:0 0 auto;padding:3px 8px;border-radius:999px;background:#e3f2ec;color:#176b58;font-size:10px;font-weight:900}.global-announcement__viewport{min-width:0;flex:1;overflow:hidden}.global-announcement__text{display:inline-flex;align-items:center;gap:8px;min-width:max-content;font-size:12px;font-weight:800;white-space:nowrap}.global-announcement__text small{font-size:11px;color:#667d75;font-weight:600}.global-announcement.ticker .global-announcement__text{animation:hammelkTicker 20s linear infinite}.global-announcement.static .global-announcement__text{min-width:0;white-space:normal}.global-announcement:hover .global-announcement__text{animation-play-state:paused}@keyframes hammelkTicker{from{transform:translateX(-5%)}to{transform:translateX(105%)}} /* مدیریت نوار اطلاع‌رسانی */ .announce-admin-page{display:grid;gap:20px}.announce-admin-hero{position:relative;overflow:hidden;display:flex;gap:17px;align-items:center;padding:25px 27px;border-radius:23px;background:linear-gradient(120deg,#173d35,#2d7562);color:#fff;box-shadow:0 18px 42px rgba(30,90,73,.16)}.announce-admin-hero::after{content:"";position:absolute;left:-45px;top:-90px;width:210px;height:210px;border:1px solid rgba(255,255,255,.14);border-radius:50%}.announce-admin-hero__icon{width:58px;height:58px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.2);border-radius:18px;background:rgba(255,255,255,.11)}.announce-admin-hero__icon .icon{width:29px;height:29px}.announce-admin-hero h1{margin:2px 0 4px;color:#fff}.announce-admin-hero p{margin:0;color:rgba(255,255,255,.77)}.announce-admin-hero .eyebrow{color:#d7efe7}.announce-admin-grid{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:18px;align-items:start}.announce-compose{grid-column:1}.announce-expiry-card{grid-column:2;grid-row:1;display:flex;gap:13px;padding:19px;border:1px solid #dce9e4;border-radius:20px;background:linear-gradient(145deg,#fff,#f5faf8);box-shadow:0 10px 28px rgba(25,70,55,.07)}.announce-expiry-card__icon{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;background:#e9f5f0;font-size:21px}.announce-expiry-card h3{margin:0 0 4px;font-size:14px}.announce-expiry-card p{margin:0;color:#6c8078;font-size:11.5px;line-height:1.9}.announce-form{display:grid;gap:15px}.announce-form label{display:grid;gap:7px;color:#345047;font-weight:800;font-size:12px}.announce-form input,.announce-form select,.announce-form textarea{width:100%;border:1px solid #d8e4df;border-radius:12px;background:#fff;padding:11px 12px;color:#263f37;outline:none}.announce-form input:focus,.announce-form select:focus,.announce-form textarea:focus{border-color:#3b8b74;box-shadow:0 0 0 3px rgba(59,139,116,.1)}.announce-form__row.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}.announce-form__timing{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:14px;border:1px solid #e1ebe7;border-radius:16px;background:#f9fbfa}.field-title{display:block;margin-bottom:9px;color:#2f5549;font-size:12px;font-weight:900}.field-optional{color:#8a9893;font-size:10px;font-weight:600}.announce-auto-expire{grid-template-columns:auto 1fr!important;align-items:center!important;padding:10px 12px;border-radius:12px;background:#f5faf8}.announce-auto-expire input{width:auto}.announce-submit{justify-self:start;min-width:180px}.announce-history-list{display:grid;gap:10px}.announce-history-item{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:14px 15px;border:1px solid #e0e9e5;border-radius:15px;background:#fff}.announce-history-item.muted{opacity:.64}.announce-history-main{min-width:0}.announce-history-title{display:flex;gap:8px;align-items:center}.announce-history-main p{margin:5px 0;color:#62766e}.announce-history-main small{color:#89968f}.badge.neutral{background:#eef1f0;color:#6e7c77} /* گروه ایام ویژه و درخواست مالک */ .special-groups-grid,.special-apply-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.special-group-card,.special-apply-card{position:relative;overflow:hidden;border:1px solid #dfe9e5;border-radius:18px;background:#fff;padding:17px;box-shadow:0 8px 25px rgba(25,70,55,.055)}.special-group-card::before,.special-apply-card::before{content:"";position:absolute;inset-inline-start:0;top:0;bottom:0;width:4px;background:#8d6a23}.special-group-card h3,.special-apply-card h3{margin:0 0 5px}.special-group-card p,.special-apply-card p{color:#687c74}.special-group-stats{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.special-group-stats span{padding:5px 8px;border-radius:9px;background:#f4f7f6;font-size:10.5px;font-weight:800;color:#53675f} /* پروفایل قابل تکمیل */ .profile-owner-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.profile-owner-form .wide{grid-column:1/-1}.profile-owner-form label{display:grid;gap:6px;font-weight:800;color:#405b52}.profile-owner-form input,.profile-owner-form textarea{width:100%;border:1px solid #dce5e1;border-radius:12px;padding:11px 12px;background:#fff}.profile-owner-form .form-actions{grid-column:1/-1} @media(max-width:900px){.smart-welcome{grid-template-columns:1fr;padding:20px}.smart-welcome-summary{grid-template-columns:repeat(3,1fr)}.smart-alert-list{min-width:0}.announce-admin-grid{grid-template-columns:1fr}.announce-compose,.announce-expiry-card{grid-column:1;grid-row:auto}.announce-expiry-card{order:-1}.announce-form__timing{grid-template-columns:1fr}.special-groups-grid,.special-apply-grid{grid-template-columns:1fr}} @media(max-width:620px){.smart-welcome{gap:14px;margin-bottom:17px;padding:18px 16px;border-radius:20px}.smart-welcome h2{font-size:21px}.smart-welcome p{font-size:12px}.smart-welcome-summary{grid-template-columns:1fr}.smart-welcome-summary a{grid-template-columns:auto 1fr;align-items:center}.smart-welcome-summary b{font-size:18px}.smart-alert{grid-template-columns:30px minmax(0,1fr)}.smart-alert a{grid-column:2;justify-self:start}.global-announcements{padding:0 10px}.global-announcement{padding-inline:10px}.global-announcement__text{font-size:11.5px}.announce-admin-hero{padding:20px 17px}.announce-admin-hero__icon{width:49px;height:49px}.announce-form__row.two{grid-template-columns:1fr}.announce-history-item{align-items:flex-start;flex-direction:column}.profile-owner-form{grid-template-columns:1fr}.profile-owner-form .wide{grid-column:auto}} /* صفحات ایام ویژه و قرعه هوشمند */ .special-groups-hero,.special-apply-hero{display:flex;justify-content:space-between;gap:18px;align-items:center;margin-bottom:18px;padding:21px 23px;border:1px solid #e1e9e6;border-radius:21px;background:linear-gradient(135deg,#fff,#f6faf8)} .special-groups-hero h1,.special-apply-hero h1{margin:3px 0 5px}.special-groups-hero p,.special-apply-hero p{margin:0;color:#687a73}.special-groups-layout{display:grid;grid-template-columns:minmax(260px,.7fr) minmax(0,1.6fr);gap:18px;align-items:start}.special-group-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.special-group-card__head{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}.special-group-card__head h3{margin:7px 0 0}.special-group-card__head>b{min-width:35px;height:35px;display:grid;place-items:center;border-radius:11px;background:#f5f3e9;color:#7b5d1e}.special-group-metrics,.special-apply-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:12px 0}.special-group-metrics span,.special-apply-meta span{display:grid;gap:2px;padding:8px;border-radius:10px;background:#f6f8f7;text-align:center}.special-group-metrics b,.special-apply-meta b{color:#294d43}.special-group-metrics small,.special-apply-meta small{font-size:9.5px;color:#7b8b85}.special-group-card footer{display:flex;justify-content:space-between;gap:9px;align-items:center;margin-top:12px;padding-top:11px;border-top:1px solid #edf1ef;color:#73847d;font-size:10.5px}.special-group-card.is-inactive{opacity:.68}.special-group-required{display:flex;justify-content:space-between;gap:18px;align-items:center;margin-bottom:18px}.special-apply-card header{display:flex;gap:12px;align-items:flex-start}.special-apply-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:#f6efd9;color:#8b671d;font-size:18px}.special-apply-card h2{font-size:17px}.special-apply-card.is-requested{border-color:#b9dfcf;background:linear-gradient(145deg,#fff,#f5fbf8)}.special-apply-card.is-unavailable{opacity:.68}.special-apply-status{margin:10px 0;padding:9px 10px;border-radius:10px;font-size:11px;font-weight:800}.special-apply-status.success{background:#eaf7f1;color:#176951}.special-apply-status.muted{background:#f2f4f3;color:#718078} .lottery-topic-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-bottom:18px}.lottery-topic-card{display:flex;gap:13px;align-items:center;padding:17px 18px;border:1px solid #dde7e3;border-radius:18px;background:#fff;color:#27463d;text-decoration:none;box-shadow:0 7px 20px rgba(28,72,57,.05)}.lottery-topic-card>span{width:43px;height:43px;display:grid;place-items:center;border-radius:13px;background:#eaf6f1;color:#24715c;font-size:21px}.lottery-topic-card.special>span{background:#f8f0da;color:#8b681e}.lottery-topic-card div{display:grid;gap:2px}.lottery-topic-card b{font-size:14px}.lottery-topic-card small{color:#74847e}.lottery-readiness-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin:15px 0}.lottery-readiness-grid article,.special-lottery-summary>div{display:grid;gap:2px;padding:12px;border:1px solid #e5ece9;border-radius:13px;background:#fafcfb}.lottery-readiness-grid b,.special-lottery-summary b{font-size:18px;color:#285246}.lottery-readiness-grid small,.special-lottery-summary span{font-size:10px;color:#7c8b85}.lottery-entitlement-summary{display:flex;gap:8px;flex-wrap:wrap}.lottery-entitlement-summary span{display:flex;gap:5px;align-items:center;padding:6px 9px;border-radius:10px;background:#f4f7f5}.lottery-quarter-mode{display:grid;grid-template-columns:1fr 1fr;gap:8px}.lottery-quarter-mode>label{position:relative}.lottery-quarter-mode input{position:absolute;opacity:0}.lottery-quarter-mode label>span{display:grid;gap:2px;padding:11px 12px;border:1px solid #dae5e0;border-radius:12px;background:#fff;cursor:pointer}.lottery-quarter-mode input:checked+span{border-color:#4e9b83;background:#f0faf6;box-shadow:0 0 0 3px rgba(66,145,120,.08)}.lottery-quarter-mode small{color:#74867e}.lottery-candidate-details{margin:14px 0;border:1px solid #e0e9e5;border-radius:13px;padding:10px 12px}.lottery-candidate-details summary{cursor:pointer;font-weight:900}.lottery-candidate-list{display:grid;gap:6px;margin-top:10px}.lottery-candidate-list div{display:flex;justify-content:space-between;gap:10px;padding:7px 9px;border-radius:9px;background:#f7f9f8}.lottery-run-form{display:flex;gap:12px;align-items:center;margin-top:15px;padding-top:14px;border-top:1px solid #e9efec}.lottery-run-form p{margin:0;color:#6b7d75;font-size:11px}.special-group-selector{display:flex;gap:10px;align-items:end;margin:8px 0 15px}.special-group-selector label{display:grid;gap:6px;flex:1;font-weight:800}.special-lottery-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:12px 0 17px}.special-applicants-head{margin-top:6px}.priority-row{background:#f4fbf7}.lottery-result-grid,.lottery-rule-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.lottery-result-grid article,.lottery-rule-grid article{padding:13px 14px;border:1px solid #e2e9e6;border-radius:13px;background:#fff}.lottery-result-grid article{display:grid;gap:3px}.lottery-result-bundle{justify-self:start;padding:3px 7px;border-radius:7px;background:#eef6f2;color:#31705e;font-size:9.5px;font-weight:900}.lottery-rule-grid article{display:grid;gap:4px}.lottery-rule-grid span{color:#6f8179;font-size:11px;line-height:1.8} @media(max-width:900px){.special-groups-layout{grid-template-columns:1fr}.special-group-grid{grid-template-columns:1fr}.lottery-readiness-grid{grid-template-columns:repeat(2,1fr)}} @media(max-width:620px){.special-groups-hero,.special-apply-hero,.special-group-required{align-items:flex-start;flex-direction:column}.lottery-topic-grid,.lottery-quarter-mode,.special-lottery-summary,.lottery-result-grid,.lottery-rule-grid{grid-template-columns:1fr}.lottery-readiness-grid{grid-template-columns:1fr 1fr}.special-group-selector,.lottery-run-form{align-items:stretch;flex-direction:column}.special-group-card footer{align-items:flex-start;flex-direction:column}} /* ===== hammelk-autosadra-parity-v23.css ===== */ /* هم‌ملک v23 — هم‌ترازی پیام خوش‌آمد و نوار اطلاع‌رسانی با پروژه اتوگالری */ html.dashboard-welcome-open,body.dashboard-welcome-open{overflow:hidden!important} .dashboard-welcome-modal{position:fixed;inset:0;z-index:12000;display:grid;place-items:center;padding:20px;direction:rtl} .dashboard-welcome-modal[hidden]{display:none!important} .dashboard-welcome-backdrop{position:absolute;inset:0;background:rgba(7,24,48,.62);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)} .dashboard-welcome-dialog{position:relative;width:min(760px,100%);border:1px solid rgba(255,255,255,.72);border-radius:28px;background:linear-gradient(145deg,#fff,#f7fbff 55%,#effcf7);box-shadow:0 30px 90px rgba(3,18,38,.34);padding:28px;animation:dashboardWelcomeIn .28s ease both;overflow:hidden} .dashboard-welcome-dialog:before{content:"";position:absolute;width:190px;height:190px;border-radius:50%;left:-105px;bottom:-125px;background:rgba(16,185,129,.11);pointer-events:none} .dashboard-welcome-dialog-head{position:relative;display:flex;align-items:center;gap:16px;padding-bottom:20px;border-bottom:1px solid #e5edf6} .dashboard-welcome-dialog-icon{width:58px;height:58px;display:grid;place-items:center;flex:0 0 58px;border-radius:20px;background:linear-gradient(145deg,#e7fff5,#e6f0ff);font-size:29px;box-shadow:inset 0 0 0 1px #dbeafe} .dashboard-welcome-dialog .welcome-eyebrow{display:block;color:#0f766e;font-size:11px;font-weight:900;line-height:1.5} .dashboard-welcome-dialog h3{margin:2px 0 5px;color:#0f2746;font-size:25px;line-height:1.55} .dashboard-welcome-dialog p{margin:0;color:#5c6f86;line-height:1.8;font-size:13.5px;font-weight:600} .dashboard-welcome-items{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:20px 0} .dashboard-welcome-items.welcome-count-1{grid-template-columns:1fr} .dashboard-welcome-items.welcome-count-2{grid-template-columns:repeat(2,minmax(0,1fr))} .dashboard-welcome-items.welcome-count-3{grid-template-columns:repeat(3,minmax(0,1fr))} .dashboard-welcome-item{display:flex;align-items:center;gap:12px;min-height:100px;padding:15px 14px;border:1px solid #dce8f5;border-radius:20px;background:#fff;color:#17365f;text-decoration:none;transition:.18s ease} .dashboard-welcome-item:hover{transform:translateY(-2px);border-color:#9bc7b0;box-shadow:0 12px 30px rgba(15,81,50,.09)} .dashboard-welcome-item-icon{width:46px;height:46px;display:grid;place-items:center;flex:0 0 46px;border-radius:15px;background:#eff6ff;font-size:21px} .dashboard-welcome-item span:last-child{display:flex;flex-direction:column;gap:3px}.dashboard-welcome-item b{font-size:23px;color:#0f5132}.dashboard-welcome-item small{font-size:11.5px;color:#64748b;font-weight:800;line-height:1.65} .dashboard-welcome-item.customer-welcome-alert{border-color:#fecaca;background:#fff7f7}.dashboard-welcome-item.customer-welcome-alert b{color:#b91c1c} .dashboard-welcome-empty{grid-column:1/-1;padding:17px;border:1px dashed #b9d6c5;border-radius:18px;background:#f0fdf4;color:#166534;font-weight:900;text-align:center;line-height:1.8} .dashboard-welcome-dialog-actions{position:relative;display:flex;justify-content:center}.dashboard-welcome-dialog .welcome-dismiss-btn{min-width:220px;border:0;border-radius:14px;padding:13px 22px;background:#0f613d;color:#fff;font-weight:1000;cursor:pointer;box-shadow:0 10px 24px rgba(15,97,61,.2)} .dashboard-welcome-modal.is-closing{opacity:0;transition:opacity .22s ease}.dashboard-welcome-modal.is-closing .dashboard-welcome-dialog{transform:translateY(10px) scale(.98);transition:.22s ease} .customer-daily-welcome-dialog{background:linear-gradient(145deg,#fff,#f8fbff 52%,#fff8ed)}.customer-daily-welcome-dialog:before{background:rgba(245,158,11,.10)} @keyframes dashboardWelcomeIn{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:none}} @media(max-width:760px){.dashboard-welcome-items.welcome-count-3{grid-template-columns:1fr}.dashboard-welcome-items.welcome-count-3 .dashboard-welcome-item{min-height:78px}} @media(max-width:640px){.dashboard-welcome-modal{padding:12px}.dashboard-welcome-dialog{border-radius:23px;padding:18px;max-height:calc(100vh - 24px);overflow:auto}.dashboard-welcome-dialog-head{align-items:flex-start}.dashboard-welcome-dialog-icon{width:48px;height:48px;flex-basis:48px;border-radius:16px;font-size:24px}.dashboard-welcome-dialog h3{font-size:20px}.dashboard-welcome-items,.dashboard-welcome-items.welcome-count-1,.dashboard-welcome-items.welcome-count-2,.dashboard-welcome-items.welcome-count-3{grid-template-columns:1fr;gap:9px;margin:14px 0}.dashboard-welcome-item{min-height:76px;padding:12px;border-radius:17px}.dashboard-welcome-dialog-actions{display:block}.dashboard-welcome-dialog .welcome-dismiss-btn{width:100%;min-width:0}} /* runtime announcement bar — matching AutoSadra behavior */ .site-announcement-runtime{position:fixed;left:0;right:0;z-index:1210;min-height:36px;display:flex;align-items:center;justify-content:center;padding:5px 12px;box-sizing:border-box;box-shadow:0 5px 16px rgba(15,23,42,.14);font-size:12px;font-family:inherit;overflow:hidden} .site-announcement-runtime[hidden]{display:none!important}.site-announcement-runtime[data-announcement-scope="internal"]{top:64px}.site-announcement-runtime.tone-info{background:#0f4c6e;color:#fff}.site-announcement-runtime.tone-success{background:#0f6b4b;color:#fff}.site-announcement-runtime.tone-warning{background:#a16207;color:#fff}.site-announcement-runtime.tone-mourning{background:#252b33;color:#f8fafc} .site-announcement-runtime-inner{display:flex;align-items:center;justify-content:center;gap:8px;width:min(1400px,100%);min-width:0;text-align:center;overflow:hidden}.site-announcement-runtime-icon{width:18px;height:18px;display:grid;place-items:center;opacity:.9;flex:0 0 auto}.site-announcement-runtime-copy{position:relative;flex:1 1 auto;min-width:0;max-width:calc(100% - 28px);height:1.75em;line-height:1.75;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;direction:rtl;text-align:center}.site-announcement-runtime-copy>span{display:inline-block;max-width:none;white-space:nowrap;vertical-align:top}.site-announcement-runtime-copy.is-marquee{direction:ltr;text-align:left;text-overflow:clip}.site-announcement-runtime-copy.is-marquee>span{position:absolute;left:0;top:0;max-width:none;direction:rtl;text-align:right;will-change:transform;animation:hammelkAnnouncementMarquee var(--announcement-duration,20s) linear infinite}.site-announcement-runtime-copy.is-marquee:hover>span{animation-play-state:paused} @keyframes hammelkAnnouncementMarquee{from{transform:translateX(-105%)}to{transform:translateX(calc(100vw + 105%))}} body.site-announcement-internal-visible .app-shell .page-content{padding-top:66px!important} @media(max-width:700px){.site-announcement-runtime{min-height:40px;padding:6px 8px;font-size:11px}.site-announcement-runtime[data-announcement-scope="internal"]{top:58px}.site-announcement-runtime-inner{gap:5px}.site-announcement-runtime-icon{width:15px;height:15px;font-size:10px}.site-announcement-runtime-copy{max-width:calc(100% - 20px);height:1.8em;line-height:1.8}body.site-announcement-internal-visible .app-shell .page-content{padding-top:59px!important}} @media(prefers-reduced-motion:reduce){.site-announcement-runtime-copy.is-marquee{direction:rtl;text-align:center;text-overflow:ellipsis}.site-announcement-runtime-copy.is-marquee>span{position:static;max-width:100%;overflow:hidden;text-overflow:ellipsis;animation:none!important;will-change:auto}} @media print{.site-announcement-runtime{display:none!important}} /* announcement manager — AutoSadra-derived card layout */ .site-announcements-page{max-width:1200px;margin:0 auto}.announcement-admin-hero{display:flex;align-items:center;gap:16px;padding:23px 25px;border-radius:22px;background:linear-gradient(135deg,rgba(2,132,199,.08),rgba(15,81,50,.08));border:1px solid rgba(148,163,184,.28);margin-bottom:18px}.announcement-admin-hero-icon{width:54px;height:54px;display:grid;place-items:center;border-radius:17px;background:#fff;font-size:25px;box-shadow:0 8px 22px rgba(15,23,42,.06)}.announcement-admin-hero-copy{flex:1}.announcement-admin-hero-copy>span{font-size:11px;color:#0f766e;font-weight:800}.announcement-admin-hero h2{margin:5px 0 7px}.announcement-admin-hero p{margin:0;color:#64748b}.announcement-admin-hero-badge{padding:8px 12px;border-radius:999px;background:#fff;color:#0f766e;font-size:10px;font-weight:900;border:1px solid #dce8e4} .announcement-admin-grid{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:16px;margin-bottom:18px}.announcement-editor-card,.announcement-help-card,.announcement-history-card{background:#fff;border:1px solid rgba(148,163,184,.28);border-radius:20px;box-shadow:0 12px 30px rgba(15,23,42,.06)}.announcement-editor-card{padding:0;overflow:hidden}.announcement-editor-head{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid #e2e8f0}.announcement-editor-title-wrap{display:flex;align-items:center;gap:10px}.announcement-editor-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:#eefaf5;color:#0f766e}.announcement-editor-title-wrap h3{margin:0}.announcement-editor-title-wrap p{margin:3px 0 0;color:#64748b;font-size:10px}.announcement-reset-btn,.announcement-mobile-reset{border:1px solid #dbe5ee;background:#fff;border-radius:10px;padding:8px 10px;cursor:pointer;font-weight:800;color:#42556b}.announcement-mobile-reset{display:none} .announcement-restored-note{margin:12px 14px 0;padding:10px 12px;display:flex;gap:9px;border-radius:12px;background:#fff7ed;border:1px solid #fed7aa;color:#9a3412}.announcement-restored-note div{display:grid}.announcement-restored-note small{font-size:10px} .announcement-form-section{margin:14px 14px 0;padding:14px;border:1px solid #e2e8f0;border-radius:14px;background:#fbfdff}.announcement-section-head{display:flex;align-items:center;gap:9px;margin-bottom:12px}.announcement-section-head>span{width:28px;height:28px;display:grid;place-items:center;border-radius:9px;background:#e8f5f0;color:#0f6b4b;font-weight:900}.announcement-section-head>div{display:grid}.announcement-section-head small{color:#64748b;font-size:10px}.announcement-form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.announcement-field{font-size:12px;font-weight:800;color:#334155}.announcement-field>span{font-weight:500;color:#94a3b8}.announcement-field>strong{color:#b91c1c;font-size:10px}.announcement-form-grid input,.announcement-form-grid select,.announcement-message-field textarea,.announcement-datetime-group input{width:100%;box-sizing:border-box;margin-top:6px}.announcement-schedule-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.announcement-schedule-card{padding:12px;border:1px solid #dce8f5;border-radius:14px;background:#fff}.announcement-schedule-card.expiry-card{background:#fff8f8;border-color:#f1d4d4}.announcement-schedule-card-head{display:flex;gap:9px;align-items:center;margin-bottom:9px}.announcement-schedule-card-head>span{width:28px;height:28px;display:grid;place-items:center;border-radius:9px;background:#e8f5f0;color:#0f6b4b}.announcement-schedule-card.expiry-card .announcement-schedule-card-head>span{background:#fff0f0;color:#b91c1c}.announcement-schedule-card-head>div{display:grid}.announcement-schedule-card-head small{font-size:9px;color:#64748b}.announcement-datetime-group{display:grid;grid-template-columns:1.25fr .75fr;gap:8px}.announcement-datetime-group label{font-size:11px;font-weight:800}.announcement-datetime-group strong{font-size:9px;color:#b91c1c}.announcement-message-field{display:block}.announcement-message-field textarea{min-height:118px;resize:none;overflow-y:hidden}.announcement-character-hint{display:block;text-align:left;margin-top:4px;color:#64748b;font-size:9px}.announcement-preview-wrap{margin:14px}.announcement-preview-head{display:flex;align-items:center;justify-content:space-between;font-size:11px;color:#64748b}.site-announcement-preview{margin-top:6px;padding:9px 12px;border-radius:10px;display:flex;justify-content:center;gap:7px;font-size:12px;color:#fff;min-height:37px;align-items:center}.site-announcement-preview.tone-info{background:#0f4c6e}.site-announcement-preview.tone-success{background:#0f6b4b}.site-announcement-preview.tone-warning{background:#a16207}.site-announcement-preview.tone-mourning{background:#252b33}.announcement-form-actions{display:flex;gap:8px;padding:0 14px 16px}.announcement-save-btn{flex:1;min-height:44px}.announcement-help-card{padding:18px;align-self:start}.announcement-help-top{display:flex;align-items:flex-start;gap:11px}.announcement-help-icon{width:42px;height:42px;flex:0 0 42px;display:grid;place-items:center;border-radius:13px;background:#e8f5f0;color:#0f6b4b;font-size:19px}.announcement-help-card h3{margin:1px 0 5px;color:#20374b;font-size:14px}.announcement-help-card p{margin:0;color:#56697c;font-size:11px;line-height:1.95}.announcement-help-points{display:grid;gap:7px;margin-top:14px;padding-top:13px;border-top:1px solid #dfe9e6}.announcement-help-points span{display:flex;align-items:center;min-height:34px;padding:7px 9px;border:1px solid #e4ecea;border-radius:10px;background:rgba(255,255,255,.76);color:#40576a;font-size:10px;font-weight:650}.announcement-tone-guide{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin-top:13px;padding-top:12px;border-top:1px solid #dfe9e6;color:#506579;font-size:9.5px}.tone-dot{width:8px;height:8px;border-radius:50%;display:inline-block}.tone-dot.info{background:#0f4c6e}.tone-dot.success{background:#0f6b4b}.tone-dot.warning{background:#a16207}.tone-dot.mourning{background:#252b33} .announcement-history-card{overflow:hidden}.announcement-history-head{display:flex;justify-content:space-between;align-items:center;padding:16px 18px;border-bottom:1px solid #e2e8f0}.announcement-history-head h3{margin:0}.announcement-history-head small,.announcement-history-head span{font-size:11px;color:#64748b}.announcement-history-list{padding:10px}.announcement-history-item{display:grid;grid-template-columns:12px minmax(0,1fr) auto;gap:12px;padding:13px;border:1px solid #e2e8f0;border-radius:14px;margin-bottom:8px}.announcement-history-item.is-disabled{opacity:.5}.announcement-history-status span{display:block;width:6px;height:100%;min-height:50px;border-radius:999px;background:#0f4c6e}.announcement-history-item.tone-success .announcement-history-status span{background:#0f6b4b}.announcement-history-item.tone-warning .announcement-history-status span{background:#a16207}.announcement-history-item.tone-mourning .announcement-history-status span{background:#252b33}.announcement-history-title{display:flex;align-items:center;gap:8px}.announcement-history-title h4{margin:0}.announcement-history-title span{font-size:9px;background:#f1f5f9;padding:3px 7px;border-radius:999px}.announcement-history-copy p{margin:6px 0;font-size:12px;color:#475569}.announcement-history-meta{display:flex;flex-wrap:wrap;gap:8px}.announcement-history-meta span{font-size:9px;color:#64748b}.announcement-history-actions{display:flex;align-items:center;gap:5px;flex-wrap:wrap;justify-content:flex-end}.announcement-history-actions form{margin:0}.announcement-history-actions .button,.announcement-history-actions .btn{padding:7px 9px;font-size:10px}.announcement-history-empty{text-align:center;padding:28px;color:#64748b} @media(max-width:1000px){.announcement-admin-grid{grid-template-columns:1fr}.announcement-help-card{order:-1}.announcement-help-points{grid-template-columns:repeat(3,minmax(0,1fr))}} @media(max-width:760px){.site-announcements-page{padding-inline:0}.announcement-admin-hero{padding:15px;border-radius:17px}.announcement-admin-hero-icon{width:44px;height:44px}.announcement-admin-hero-copy h2{font-size:18px}.announcement-admin-hero-copy p{font-size:10px}.announcement-admin-hero-badge{display:none}.announcement-admin-grid{gap:10px}.announcement-editor-card,.announcement-help-card,.announcement-history-card{border-radius:15px}.announcement-editor-head{padding:12px;align-items:flex-start}.announcement-editor-title-wrap h3{font-size:13px}.announcement-editor-title-wrap p{font-size:9px}.announcement-reset-btn{display:none}.announcement-form-section{margin:9px 9px 0;padding:10px}.announcement-basic-grid{grid-template-columns:1fr}.announcement-schedule-grid{grid-template-columns:1fr}.announcement-datetime-group{grid-template-columns:minmax(0,1.25fr) minmax(100px,.75fr)}.announcement-message-field textarea{min-height:112px}.announcement-preview-wrap{margin:10px 9px}.announcement-form-actions{padding:10px 9px 12px;display:grid;grid-template-columns:minmax(0,1fr) auto}.announcement-mobile-reset{display:inline-flex}.announcement-help-points{grid-template-columns:1fr}.announcement-history-head{padding:11px}.announcement-history-list{padding:6px}.announcement-history-item{grid-template-columns:5px minmax(0,1fr);gap:8px;padding:9px}.announcement-history-actions{grid-column:2;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;gap:5px}.announcement-history-actions form{width:100%}.announcement-history-actions .button,.announcement-history-actions .btn{width:100%;justify-content:center}.announcement-history-copy p{font-size:10px}} @media(max-width:430px){.announcement-admin-hero-copy p{display:none}.announcement-datetime-group{grid-template-columns:1fr}.announcement-form-actions{grid-template-columns:1fr}.announcement-mobile-reset{width:100%;justify-content:center}.announcement-history-actions{grid-template-columns:1fr 1fr}.announcement-history-actions>button:first-child{grid-column:1/-1}.announcement-help-card{display:none}} /* ===== hammelk-v25-account-stay-message.css ===== */ /* v25 — حساب کاربری، ورود/خروج و صندوق پیام */ :root{--v25-shadow:0 18px 48px rgba(15,23,42,.08);--v25-line:#e6edf3;--v25-soft:#f7fafc;--v25-ink:#153238;--v25-muted:#70848a} /* ---------- Account ---------- */ .account-hero{display:flex;align-items:center;justify-content:space-between;gap:22px;padding:25px 27px;border-radius:24px;background:linear-gradient(135deg,#103f42,#176b69);color:#fff;box-shadow:0 18px 46px rgba(15,89,88,.18);margin-bottom:18px;overflow:hidden;position:relative}.account-hero:after{content:"";position:absolute;inset:auto -70px -110px auto;width:260px;height:260px;border-radius:50%;background:rgba(255,255,255,.06)}.account-identity{display:flex;align-items:center;gap:16px;position:relative;z-index:1}.account-avatar{width:64px;height:64px;border-radius:20px;display:grid;place-items:center;background:#fff;color:#0f766e;font-size:27px;font-weight:900;box-shadow:0 12px 28px rgba(0,0,0,.15)}.account-identity h1{margin:5px 0 5px;font-size:24px}.account-identity p{margin:0;color:rgba(255,255,255,.72)}.account-completion{display:flex;align-items:center;gap:12px;position:relative;z-index:1;max-width:360px}.account-completion-ring{--value:0;width:66px;height:66px;flex:0 0 auto;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#99f6e4 calc(var(--value)*1%),rgba(255,255,255,.18) 0);position:relative}.account-completion-ring:after{content:"";position:absolute;width:50px;height:50px;border-radius:50%;background:#145857}.account-completion-ring strong{position:relative;z-index:1;font-size:12px}.account-completion b,.account-completion small{display:block}.account-completion small{color:rgba(255,255,255,.72);margin-top:5px;line-height:1.8} .account-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:18px}.account-summary-grid article{background:#fff;border:1px solid var(--v25-line);border-radius:18px;padding:17px 18px;box-shadow:0 8px 26px rgba(15,23,42,.045)}.account-summary-grid span,.account-summary-grid small{display:block;color:var(--v25-muted);font-size:11px}.account-summary-grid strong{display:block;font-size:22px;margin:6px 0}.account-summary-grid a{text-decoration:none;color:#0f766e;font-weight:800} .account-layout{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(300px,.7fr);gap:18px;align-items:start}.account-main,.account-side{display:grid;gap:18px}.account-card,.account-security-card{padding:0;overflow:hidden}.account-card-head{padding:20px 22px 16px;border-bottom:1px solid var(--v25-line);display:flex;align-items:flex-start;gap:12px}.account-card-head.compact{padding-bottom:14px}.account-card-head h2{margin:4px 0 5px;font-size:17px}.account-card-head p{margin:0;color:var(--v25-muted);font-size:11px;line-height:1.9}.account-section-no{display:inline-grid;place-items:center;min-width:30px;height:25px;padding:0 8px;border-radius:999px;background:#e6fffb;color:#0f766e;font-weight:900;font-size:10px}.account-form{padding:20px 22px 22px}.account-field-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.account-field-grid label,.account-password-form label{display:grid;gap:7px;font-weight:800;font-size:11px;color:#385058}.account-field-grid input,.account-field-grid textarea,.account-password-form input{width:100%;border:1px solid #dbe5ea;border-radius:13px;background:#fbfdfe;padding:12px 13px;outline:none;transition:.18s}.account-field-grid input:focus,.account-field-grid textarea:focus,.account-password-form input:focus{border-color:#5cc8be;box-shadow:0 0 0 4px rgba(20,184,166,.09);background:#fff}.account-field-grid .wide{grid-column:1/-1}.account-subsection{margin-top:21px;padding-top:18px;border-top:1px dashed #dce7eb}.account-subsection h3{font-size:13px;margin:0 0 13px;color:#31535a}.account-actions{display:flex;justify-content:flex-end;margin-top:18px}.account-password-form{padding:18px 20px;display:grid;gap:13px}.account-session-note{margin:0 20px 20px;padding:13px 14px;border-radius:15px;background:#eefcf8;border:1px solid #c7f0e6;display:flex;gap:10px;align-items:flex-start}.account-session-note>span{width:25px;height:25px;border-radius:50%;display:grid;place-items:center;background:#0f766e;color:#fff;font-weight:900}.account-session-note p{margin:0}.account-session-note b,.account-session-note small{display:block}.account-session-note small{margin-top:4px;color:#647f82;line-height:1.8}.account-side-link{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:16px 17px;border:1px solid var(--v25-line);border-radius:17px;background:#fff;text-decoration:none;box-shadow:0 7px 22px rgba(15,23,42,.04)}.account-side-link>span{width:38px;height:38px;border-radius:12px;background:#e6fffb;color:#0f766e;display:grid;place-items:center;font-size:20px}.account-side-link b,.account-side-link small{display:block}.account-side-link small{color:var(--v25-muted);margin-top:4px}.account-side-link i{font-style:normal;color:#0f766e;font-size:20px} /* ---------- Stay workflow ---------- */ .stay-v25-head{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:16px}.stay-v25-head h1{margin:5px 0 6px;font-size:25px}.stay-v25-head p{margin:0;color:var(--v25-muted)}.stay-v25-rate{min-width:250px;border:1px solid #d8ebe7;border-radius:17px;background:#f4fbf9;padding:13px 15px}.stay-v25-rate span,.stay-v25-rate b,.stay-v25-rate small{display:block}.stay-v25-rate span{font-size:10px;color:#56807c;font-weight:800}.stay-v25-rate b{margin:5px 0;color:#0f5f5a}.stay-v25-rate small{color:#6f8788} .stay-section-title{display:flex;justify-content:space-between;margin:20px 0 10px}.stay-section-title h2{margin:4px 0 0;font-size:17px}.stay-open-list{margin-bottom:18px}.stay-open-card{display:grid;grid-template-columns:auto 1fr minmax(270px,auto);gap:18px;align-items:center;background:#fff;border:1px solid #dceae6;border-right:4px solid #14b8a6;border-radius:20px;padding:17px 18px;box-shadow:0 9px 28px rgba(15,23,42,.05)}.stay-open-card.foreign{border-right-color:#f59e0b}.stay-open-status{display:grid;place-items:center;text-align:center;min-width:92px}.stay-open-status>span{color:#14b8a6;font-size:17px}.stay-open-status b{font-size:11px}.stay-open-status small{color:var(--v25-muted);margin-top:4px}.stay-open-copy h3{margin:0 0 6px}.stay-open-copy p{margin:0;color:var(--v25-muted)}.stay-auth-badge{display:inline-flex;margin-top:9px;border-radius:999px;padding:5px 9px;font-size:10px;font-weight:900}.stay-auth-badge.pending,.stay-auth-badge.unauthorized,.stay-auth-badge.denied{background:#fff3e8;color:#b45309}.stay-checkout-form{display:grid;grid-template-columns:1fr auto;align-items:end;gap:9px}.stay-checkout-form label{display:grid;gap:5px;font-size:10px;font-weight:800;color:#60777a}.stay-checkout-form input{border:1px solid #dbe5ea;border-radius:11px;padding:10px} .stay-v25-form-card{padding:0;overflow:hidden}.stay-v25-mode-head{padding:20px 22px;background:linear-gradient(180deg,#fbfefe,#fff);border-bottom:1px solid var(--v25-line)}.stay-v25-mode-head h2{margin:5px 0 5px;font-size:18px}.stay-v25-mode-head p{margin:0;color:var(--v25-muted)}.stay-v25-form{padding:0}.stay-v25-section{padding:21px 22px;border-bottom:1px solid var(--v25-line)}.stay-v25-section>header{display:flex;gap:11px;align-items:flex-start;margin-bottom:16px}.stay-v25-section>header>span{width:30px;height:30px;border-radius:10px;background:#e6fffb;color:#0f766e;display:grid;place-items:center;font-weight:900}.stay-v25-section h3{margin:1px 0 5px;font-size:15px}.stay-v25-section p{margin:0;color:var(--v25-muted);font-size:11px}.field-hint{display:block;color:#90a2a6;font-weight:500;margin-top:3px}.stay-v25-section input,.stay-v25-section select,.stay-v25-section textarea,.stay-manager-advanced input,.stay-manager-advanced textarea{border:1px solid #dbe5ea;border-radius:13px;background:#fbfdfe;padding:12px 13px;outline:none}.stay-v25-section input:focus,.stay-v25-section select:focus,.stay-v25-section textarea:focus{border-color:#54c3b9;box-shadow:0 0 0 4px rgba(20,184,166,.09)} .stay-manager-advanced{margin:16px 22px;border:1px dashed #d9e4e8;border-radius:15px;background:#fbfcfd}.stay-manager-advanced summary{cursor:pointer;padding:13px 15px;font-weight:900;color:#516b70}.stay-manager-advanced>div{padding:0 15px 15px;display:grid;gap:12px}.stay-manager-advanced textarea{width:100%;margin-top:6px} .stay-foreign-confirm{margin:18px 22px;padding:17px;border:1px solid #fdba74;border-radius:18px;background:#fff8ed;display:grid;grid-template-columns:auto 1fr;gap:13px}.stay-foreign-icon{width:38px;height:38px;border-radius:12px;background:#f97316;color:#fff;display:grid;place-items:center;font-weight:900}.stay-foreign-copy h3{margin:0 0 6px;color:#9a3412}.stay-foreign-copy p{margin:0 0 11px;color:#7c4a31}.stay-foreign-facts{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}.stay-foreign-facts span{padding:7px 9px;background:#fff;border:1px solid #fed7aa;border-radius:10px;font-size:10px}.stay-foreign-confirm fieldset{border:0;padding:0;margin:10px 0;display:flex;gap:14px;flex-wrap:wrap}.stay-foreign-confirm legend{width:100%;font-weight:900;font-size:11px;margin-bottom:6px}.stay-foreign-confirm label{font-size:11px}.stay-foreign-confirm>div>small{display:block;color:#9a5a33;line-height:1.8} .stay-v25-submit-zone{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:19px 22px;background:#f8fbfc}.stay-cost-preview span,.stay-cost-preview strong,.stay-cost-preview small{display:block}.stay-cost-preview span{font-size:10px;color:#73898d}.stay-cost-preview strong{font-size:20px;margin:4px 0;color:#0f5f5a}.stay-cost-preview small{color:#8ba0a3}.stay-submit-actions{display:flex;gap:9px;flex-wrap:wrap} .stay-history-shell{margin-top:18px}.stay-history-details{border:1px solid var(--v25-line);border-radius:18px;background:#fff;overflow:hidden;box-shadow:0 8px 24px rgba(15,23,42,.035)}.stay-history-details>summary{list-style:none;display:flex;justify-content:space-between;align-items:center;cursor:pointer;padding:16px 18px}.stay-history-details>summary::-webkit-details-marker{display:none}.stay-history-details>summary b,.stay-history-details>summary small{display:block}.stay-history-details>summary small{color:var(--v25-muted);margin-top:3px}.stay-history-details>summary i{font-style:normal}.stay-history-list{padding:0 15px 15px;display:grid;gap:10px}.stay-record-card{border:1px solid #e5ecef;border-radius:15px;padding:14px}.stay-record-main{display:flex;justify-content:space-between;gap:16px}.stay-record-main span{font-size:10px;color:#70868a}.stay-record-main h3{margin:4px 0}.stay-record-main p{margin:0;color:#87999c;font-size:10px}.stay-record-main>strong{color:#0f5f5a}.stay-record-main>strong small{font-size:9px}.stay-record-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:12px}.stay-record-grid span{padding:9px;background:#f8fafb;border-radius:10px}.stay-record-grid small,.stay-record-grid b{display:block}.stay-record-grid small{color:#8ca0a4;font-size:9px}.stay-record-grid b{margin-top:4px;font-size:10px}.stay-auth-text{font-style:normal}.stay-auth-text.danger{color:#c2410c}.stay-foreign-note{margin-top:10px;padding:9px 10px;background:#fff8ed;color:#8a4b25;border-radius:10px;font-size:10px}.stay-record-actions{display:flex;justify-content:flex-end;margin-top:10px} .stay-auth-page{max-width:760px;margin:30px auto;background:#fff;border:1px solid var(--v25-line);border-radius:24px;padding:28px;box-shadow:var(--v25-shadow);text-align:center}.stay-auth-page-icon{width:58px;height:58px;margin:0 auto 13px;border-radius:18px;background:#fff3e8;color:#ea580c;display:grid;place-items:center;font-size:27px;font-weight:900}.stay-auth-page h1{margin:6px 0 7px}.stay-auth-page>p{color:var(--v25-muted)}.stay-auth-page-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:19px 0}.stay-auth-page-facts span{padding:13px;background:#f8fafb;border-radius:13px}.stay-auth-page-facts small,.stay-auth-page-facts b{display:block}.stay-auth-page-facts small{color:#8a9da1;font-size:9px}.stay-auth-page-facts b{margin-top:5px}.stay-auth-page-actions{display:flex;justify-content:center;gap:10px}.stay-auth-page-note{display:block;margin-top:13px;color:#83979a;line-height:1.8} /* ---------- Message center ---------- */ .message-center-head{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:23px 25px;border-radius:22px;background:linear-gradient(135deg,#103f42,#176b69);color:#fff;margin-bottom:14px;box-shadow:0 16px 40px rgba(15,89,88,.16)}.message-center-head h1{margin:5px 0 6px}.message-center-head p{margin:0;color:rgba(255,255,255,.72)}.message-center-count{min-width:92px;text-align:center;padding:10px 14px;border-radius:15px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.14)}.message-center-count strong,.message-center-count span{display:block}.message-center-count strong{font-size:24px}.message-center-count span{font-size:9px;color:#cbf4ee}.message-filter{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}.message-filter a{display:flex;align-items:center;gap:7px;text-decoration:none;padding:8px 11px;border-radius:999px;border:1px solid #dfe8eb;background:#fff;color:#61777b;font-size:10px;font-weight:800}.message-filter a.active{background:#e6fffb;color:#0f766e;border-color:#aee8df}.message-filter b{min-width:20px;height:20px;padding:0 5px;border-radius:999px;background:#eef3f5;display:grid;place-items:center}.message-list{display:grid;gap:10px}.message-card{display:grid;grid-template-columns:auto 1fr auto;gap:13px;align-items:center;padding:16px 17px;background:#fff;border:1px solid #e2eaed;border-radius:17px;box-shadow:0 6px 20px rgba(15,23,42,.035)}.message-card.unread{border-right:4px solid #14b8a6}.message-card.priority-important{border-right-color:#f59e0b}.message-card.priority-urgent{border-right-color:#ef4444}.message-card-mark{width:39px;height:39px;border-radius:12px;background:#eef7f6;color:#0f766e;display:grid;place-items:center;font-weight:900}.message-card.priority-important .message-card-mark{background:#fff7df;color:#b45309}.message-card.priority-urgent .message-card-mark{background:#fff0f0;color:#b91c1c}.message-card-meta{display:flex;gap:7px;align-items:center;flex-wrap:wrap;margin-bottom:5px}.message-card-meta span,.message-card-meta b,.message-card-meta i{font-size:9px;font-style:normal;border-radius:999px;padding:3px 7px;background:#f2f6f7;color:#73878a}.message-card-meta b{background:#fff1d9;color:#a35a00}.message-card-meta i{background:#e8fbf7;color:#0f766e}.message-card h3{margin:0 0 5px;font-size:14px}.message-card p{margin:0;color:#60777b;line-height:1.9;font-size:11px}.message-card-copy>small{display:block;margin-top:7px;color:#98a8aa;font-size:9px} @media(max-width:900px){.account-summary-grid{grid-template-columns:repeat(2,1fr)}.account-layout{grid-template-columns:1fr}.account-side{grid-template-columns:1fr 1fr}.account-field-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.stay-open-card{grid-template-columns:1fr}.stay-checkout-form{grid-template-columns:1fr auto}.stay-record-grid{grid-template-columns:repeat(2,1fr)}} @media(max-width:640px){.account-hero{padding:19px;align-items:flex-start;flex-direction:column}.account-avatar{width:54px;height:54px;border-radius:17px}.account-identity h1{font-size:20px}.account-completion{width:100%;padding-top:12px;border-top:1px solid rgba(255,255,255,.12)}.account-summary-grid{grid-template-columns:1fr 1fr;gap:8px}.account-summary-grid article{padding:13px}.account-summary-grid strong{font-size:18px}.account-side{grid-template-columns:1fr}.account-field-grid{grid-template-columns:1fr}.account-form{padding:16px}.account-card-head{padding:16px}.stay-v25-head{align-items:stretch;flex-direction:column}.stay-v25-head h1{font-size:21px}.stay-v25-rate{min-width:0}.stay-v25-section{padding:17px 15px}.stay-v25-submit-zone{align-items:stretch;flex-direction:column;padding:16px}.stay-submit-actions{display:grid;grid-template-columns:1fr}.stay-submit-actions .button{width:100%}.stay-foreign-confirm{margin:14px 15px;grid-template-columns:1fr}.stay-manager-advanced{margin:14px 15px}.stay-open-card{padding:14px}.stay-open-status{display:flex;justify-content:flex-start;gap:7px;min-width:0}.stay-checkout-form{grid-template-columns:1fr}.stay-record-main{flex-direction:column}.stay-record-grid{grid-template-columns:1fr 1fr}.stay-auth-page{margin:12px;padding:19px 15px}.stay-auth-page-facts{grid-template-columns:1fr}.stay-auth-page-actions{display:grid}.message-center-head{padding:18px;align-items:flex-start}.message-center-head h1{font-size:21px}.message-card{grid-template-columns:auto 1fr}.message-card-action{grid-column:1/-1}.message-card-action .button{width:100%}.message-filter{overflow:auto;flex-wrap:nowrap;padding-bottom:3px}.message-filter a{flex:0 0 auto}} /* ===== hammelk-v26-management-reports.css ===== */ /* v26 — مدیریت دسترسی، کارت‌های فشرده، اقامت و مرکز گزارشات */ :root{--v26-line:#e1e9ed;--v26-soft:#f7fafb;--v26-ink:#17363b;--v26-muted:#71868b;--v26-brand:#0f766e;--v26-brand-2:#115e59;--v26-shadow:0 12px 34px rgba(15,23,42,.065);--v26-danger:#b42318;--v26-warn:#b54708} /* shared report / page */ .report-heading,.owner-heading-v26,.users-v26-head,.stay-v26-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:16px}.report-heading h1,.owner-heading-v26 h1,.users-v26-head h1,.stay-v26-head h1{margin:4px 0 6px;font-size:25px;color:var(--v26-ink)}.report-heading p,.owner-heading-v26 p,.users-v26-head p,.stay-v26-head p{margin:0;color:var(--v26-muted);line-height:1.9}.heading-actions{display:flex;gap:8px;flex-wrap:wrap}.report-filter-bar{display:grid;grid-template-columns:repeat(4,minmax(150px,1fr)) auto;gap:10px;align-items:end;padding:14px 16px;margin-bottom:14px}.report-filter-bar label{display:grid;gap:6px;color:#526d72;font-size:10px;font-weight:800}.report-filter-bar input,.report-filter-bar select{width:100%;min-height:40px;border:1px solid #d8e3e7;border-radius:11px;padding:8px 10px;background:#fff;color:var(--v26-ink)}.report-filter-bar .actions{display:flex;gap:7px;align-items:center;flex-wrap:wrap}.report-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px;margin-bottom:14px}.report-kpi-grid>article{background:#fff;border:1px solid var(--v26-line);border-radius:16px;padding:15px 16px;box-shadow:var(--v26-shadow)}.report-kpi-grid span,.report-kpi-grid small{display:block;color:var(--v26-muted);font-size:10px}.report-kpi-grid strong{display:block;margin:6px 0 4px;font-size:21px;color:var(--v26-ink)} .report-tabs{display:flex;gap:7px;overflow:auto;padding:5px;margin:0 0 14px;background:#eef4f5;border:1px solid #dde8ea;border-radius:14px}.report-tabs a{white-space:nowrap;text-decoration:none;color:#587075;padding:8px 12px;border-radius:10px;font-size:10px;font-weight:900}.report-tabs a:hover{background:#fff;color:var(--v26-brand)}.report-tabs a.active{background:#fff;color:var(--v26-brand);box-shadow:0 5px 16px rgba(15,23,42,.07)}.report-table-panel{padding:0;overflow:hidden}.report-table-panel .panel-head{padding:15px 17px;border-bottom:1px solid var(--v26-line);display:flex;justify-content:space-between;align-items:center;gap:12px}.report-table-panel .panel-head h2{margin:0 0 4px;font-size:16px}.report-table-panel .panel-head p{margin:0;color:var(--v26-muted);font-size:10px}.report-table-panel .table-wrap{overflow:auto}.report-table-panel table{width:100%;border-collapse:collapse;min-width:760px}.report-table-panel th{background:#f7fafb;color:#536c71;font-size:9px;text-align:right;padding:10px 12px;border-bottom:1px solid var(--v26-line)}.report-table-panel td{padding:11px 12px;border-bottom:1px solid #edf2f4;font-size:10px;vertical-align:middle}.report-table-panel tr:last-child td{border-bottom:0}.report-table-panel a{text-decoration:none}.finance-direction{display:inline-flex;padding:4px 8px;border-radius:999px;font-weight:900;font-size:9px}.finance-direction.credit{background:#ecfdf5;color:#047857}.finance-direction.debit{background:#fff1f2;color:#be123c}.muted{display:block;color:var(--v26-muted);font-size:9px;margin-top:4px}.report-owner-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:14px}.report-owner-list a{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 12px;border:1px solid var(--v26-line);border-radius:12px;color:var(--v26-ink);background:#fff}.report-owner-list a:hover{border-color:#9ed6d0;background:#f2fbf9} /* CSS charts */ .accounting-chart-grid-v26{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:14px}.chart-card-v26{padding:15px 16px;min-height:265px;overflow:hidden}.chart-card-v26>header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:14px}.chart-card-v26 h2{margin:0 0 5px;font-size:14px}.chart-card-v26 p{margin:0;color:var(--v26-muted);font-size:9px}.dual-month-chart-v26{height:180px;display:flex;align-items:stretch;gap:6px;overflow-x:auto;padding:7px 2px 0}.dual-month-chart-v26>a{min-width:38px;flex:1;display:grid;grid-template-rows:1fr auto;gap:5px;text-decoration:none;color:#71868b;text-align:center}.dual-month-chart-v26>a>div{height:150px;display:flex;align-items:flex-end;justify-content:center;gap:3px;border-bottom:1px solid #dce6e9}.dual-month-chart-v26 i{display:block;width:9px;min-height:2px;border-radius:5px 5px 1px 1px;transition:.15s}.dual-month-chart-v26 i.positive,.chart-legend-v26 i.positive{background:#0f9f8f}.dual-month-chart-v26 i.negative,.chart-legend-v26 i.negative{background:#e16b5b}.dual-month-chart-v26 i.charge,.chart-legend-v26 i.charge{background:#d99a32}.dual-month-chart-v26 b{font-size:8px;direction:ltr}.chart-legend-v26{display:flex;gap:14px;justify-content:center;margin-top:7px;color:#657d81;font-size:9px}.chart-legend-v26 span{display:flex;align-items:center;gap:5px}.chart-legend-v26 i{width:9px;height:9px;border-radius:3px} .hbar-list-v26{display:grid;gap:10px}.hbar-list-v26>a{display:grid;grid-template-columns:minmax(110px,1.2fr) minmax(100px,2fr) auto;align-items:center;gap:8px;text-decoration:none;color:var(--v26-ink)}.hbar-list-v26>a>span{font-size:9px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hbar-list-v26>a>i,.expense-mix-v26 i{display:block;height:8px;background:#edf3f4;border-radius:999px;overflow:hidden}.hbar-list-v26>a>i>em,.expense-mix-v26 i>em{display:block;height:100%;background:#56b9b0;border-radius:inherit}.debt-bars-v26>a>i>em{background:#e19b62}.hbar-list-v26>a>b{font-size:9px;direction:ltr}.expense-mix-v26{display:grid;gap:10px}.expense-mix-v26>div{display:grid;grid-template-columns:minmax(105px,1fr) minmax(100px,2fr) auto;gap:9px;align-items:center}.expense-mix-v26 span b,.expense-mix-v26 span small{display:block}.expense-mix-v26 span b{font-size:9px}.expense-mix-v26 span small{color:var(--v26-muted);font-size:8px}.expense-mix-v26>div>strong{font-size:9px}.trend-bars-v26{height:190px;display:flex;gap:6px;align-items:flex-end;overflow-x:auto;padding:5px 2px}.trend-bars-v26>div{min-width:44px;flex:1;height:100%;display:grid;grid-template-rows:1fr auto auto;align-items:end;text-align:center}.trend-bars-v26 i{width:12px;min-height:2px;margin:auto auto 4px;border-radius:5px 5px 1px 1px}.trend-bars-v26 i.up{background:#4bb0a5}.trend-bars-v26 i.down{background:#df796c}.trend-bars-v26 b{font-size:8px;direction:ltr;color:#6b8084}.trend-bars-v26 small{font-size:7px;color:#8b9c9f;direction:ltr}.chart-card-v26 .empty-state{align-self:center;grid-column:1/-1;padding:40px 10px} /* users compact cards */ .user-stat-grid-v26{grid-template-columns:repeat(4,minmax(0,1fr));gap:11px}.users-v26-panel{padding:0;overflow:hidden}.user-tools-v26{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:14px 16px;border-bottom:1px solid var(--v26-line)}.user-tools-v26 h2{margin:0 0 4px;font-size:16px}.user-tools-v26 p{margin:0;color:var(--v26-muted);font-size:9px}.users-v26-tools{display:grid;grid-template-columns:minmax(220px,1.5fr) minmax(120px,.7fr) minmax(120px,.7fr);gap:8px;min-width:min(620px,65%)}.users-v26-tools select,.users-v26-tools input{width:100%;min-height:39px;border:1px solid #d8e3e7;border-radius:11px;background:#fff;padding:8px 10px}.users-v26-tools .search-box{display:flex;align-items:center;gap:7px}.users-v26-tools .search-box span{font-size:18px;color:#7c9296}.users-v26-tools .search-box input{border:0;padding:0;outline:0;min-height:auto}.user-card-grid-v26{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:13px}.user-card-v26{padding:13px;border-radius:15px;min-width:0;box-shadow:0 5px 16px rgba(15,23,42,.035)}.user-card-top-v26{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:'avatar ident' 'badges badges';align-items:center;gap:9px}.user-card-top-v26 .user-avatar{grid-area:avatar;width:42px;height:42px;border-radius:13px}.user-card-top-v26 .user-identity{grid-area:ident}.user-card-top-v26 .user-badges{grid-area:badges;display:flex;gap:5px;flex-wrap:wrap;margin-top:1px}.user-card-v26 .status-chip{margin:0;padding:4px 7px;font-size:8px}.status-chip.neutral{background:#f1f5f6;color:#5d7276}.status-chip.management{background:#e9f8f5;color:#08766e}.status-chip.warning{background:#fff7e8;color:#a15c08}.user-primary-meta{display:grid;grid-template-columns:1.15fr 1fr .85fr;gap:6px;margin:10px 0}.user-primary-meta>span{min-width:0;background:#f7fafb;border:1px solid #edf2f4;border-radius:9px;padding:7px 8px}.user-primary-meta small,.user-primary-meta b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-primary-meta small{font-size:7px;color:#809296;margin-bottom:3px}.user-primary-meta b{font-size:8.5px;color:#2d484d}.user-more{border-top:1px dashed #e2eaed;border-bottom:1px dashed #e2eaed;margin:7px 0}.user-more>summary{cursor:pointer;padding:7px 1px;color:#607b80;font-size:8px;font-weight:900}.user-secondary-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:0 0 8px}.user-secondary-meta span{font-size:8px;color:#83969a}.user-secondary-meta b{display:block;color:#415a5f;margin-top:2px}.management-access-row,.root-admin-note{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 9px;margin-top:8px;border-radius:10px;background:#f2fbf9;border:1px solid #d9efeb}.management-access-row>div{min-width:0}.management-access-row b,.management-access-row small,.root-admin-note b,.root-admin-note span{display:block}.management-access-row b,.root-admin-note b{font-size:9px}.management-access-row small,.root-admin-note span{font-size:7.5px;color:#6f8689;margin-top:2px}.management-access-row.readonly{background:#f7f9fa;border-color:#e7ecee}.management-switch{position:relative;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;cursor:pointer;-webkit-tap-highlight-color:transparent}.management-switch-input{position:absolute;inline-size:1px;block-size:1px;opacity:0;pointer-events:none}.management-switch-track{position:relative;display:block;width:40px;height:24px;min-width:40px;border-radius:999px;background:#cbd5d8;box-shadow:inset 0 0 0 1px rgba(71,85,105,.08);transition:background .18s ease,box-shadow .18s ease}.management-switch-track i{position:absolute;width:18px;height:18px;top:3px;right:3px;border-radius:50%;background:#fff;box-shadow:0 1px 5px rgba(0,0,0,.2);transition:transform .18s ease}.management-switch-input:checked+.management-switch-track{background:#16a394;box-shadow:inset 0 0 0 1px rgba(8,118,110,.12)}.management-switch-input:checked+.management-switch-track i{transform:translateX(-16px)}.management-switch-input:focus-visible+.management-switch-track{outline:3px solid rgba(37,99,235,.2);outline-offset:3px}.management-switch-input:disabled+.management-switch-track{opacity:.62;cursor:wait}.user-card-v26:target{box-shadow:0 0 0 3px rgba(22,163,148,.14),0 8px 24px rgba(15,23,42,.06);border-color:#a8ddd5}.root-admin-note{background:#f0f7ff;border-color:#d5e7fb}.user-card-actions-v26{display:flex;gap:6px;margin-top:9px;grid-template-columns:none}.user-card-actions-v26 .button{min-height:32px;padding:6px 10px;font-size:8px;flex:1}.user-action-more{position:relative;flex:1}.user-action-more>summary{list-style:none;text-align:center;cursor:pointer}.user-action-more>summary::-webkit-details-marker{display:none}.user-action-more>div{position:absolute;left:0;bottom:38px;z-index:10;min-width:145px;background:#fff;border:1px solid var(--v26-line);border-radius:11px;padding:5px;box-shadow:0 15px 36px rgba(15,23,42,.15)}.user-action-more form{margin:0}.text-action{width:100%;border:0;background:transparent;text-align:right;padding:8px 9px;border-radius:7px;font-size:9px;color:#40585d;cursor:pointer}.text-action:hover{background:#f2f6f7}.hidden-permissions{display:none!important}.management-create-toggle{display:flex!important;align-items:center;gap:10px;padding:11px 12px;border:1px solid #dbe9e7;border-radius:12px;background:#f3fbfa}.management-create-toggle input{width:18px;height:18px;accent-color:var(--v26-brand)}.management-create-toggle b,.management-create-toggle small{display:block}.management-create-toggle small{color:var(--v26-muted);font-size:9px;margin-top:3px} /* owners compact */ .owner-summary-v26{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0 0 14px}.owner-summary-v26>article{background:#fff;border:1px solid var(--v26-line);border-radius:15px;padding:14px 15px;box-shadow:var(--v26-shadow)}.owner-summary-v26 span,.owner-summary-v26 small{display:block;color:var(--v26-muted);font-size:9px}.owner-summary-v26 strong{display:block;font-size:21px;margin:5px 0;color:var(--v26-ink)}.owner-list-v26{padding:0;overflow:visible}.owner-list-toolbar-v26{display:flex;justify-content:space-between;gap:13px;align-items:center;padding:14px 16px;border-bottom:1px solid var(--v26-line)}.owner-list-toolbar-v26 h2{margin:0 0 4px;font-size:16px}.owner-list-toolbar-v26 p{margin:0;color:var(--v26-muted);font-size:9px}.owner-toolbar-controls-v26{display:grid;grid-template-columns:minmax(220px,1.5fr) minmax(120px,.7fr) minmax(120px,.7fr);gap:8px;min-width:min(650px,68%)}.owner-toolbar-controls-v26 input,.owner-toolbar-controls-v26 select{width:100%;min-height:39px;border:1px solid #d8e3e7;border-radius:11px;background:#fff;padding:8px 10px}.owner-card-grid-v26{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:13px}.owner-card-v26{border:1px solid var(--v26-line);border-radius:15px;padding:13px;background:#fff;min-width:0;box-shadow:0 5px 16px rgba(15,23,42,.035)}.owner-card-head-v26{display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:center}.owner-avatar-v26{width:42px;height:42px;border-radius:13px}.owner-name-v26{min-width:0}.owner-name-v26 h3{margin:0 0 3px;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.owner-name-v26 p{margin:0;color:var(--v26-muted);font-size:8px}.owner-head-badges-v26{grid-column:1/-1;display:flex;gap:5px;flex-wrap:wrap}.share-badge-v26{display:inline-flex;border-radius:999px;background:#eaf8f6;color:#08756d;padding:4px 8px;font-size:8px;font-weight:900}.owner-card-v26 .status-chip{margin:0;padding:4px 7px;font-size:8px}.owner-usage-v26{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:10px 0}.owner-usage-v26>span{padding:8px;background:#f7fafb;border:1px solid #edf2f4;border-radius:9px;text-align:center}.owner-usage-v26 small,.owner-usage-v26 b{display:block}.owner-usage-v26 small{font-size:7px;color:#7a9094}.owner-usage-v26 b{font-size:11px;margin-top:2px}.owner-usage-v26 .owner-remain b{color:var(--v26-brand)}.owner-warning-row-v26{display:flex;gap:5px;flex-wrap:wrap;min-height:23px}.owner-warning{border-radius:8px;padding:4px 6px;font-size:7.5px;font-weight:800}.owner-warning.debt{background:#fff2ef;color:#b23b2f}.owner-warning.incomplete{background:#fff7e8;color:#9b5b0c}.owner-warning.feedback{background:#f4efff;color:#6f4ab4}.owner-detail-v26{margin:8px 0;border-top:1px dashed #e2eaed;border-bottom:1px dashed #e2eaed}.owner-detail-v26 summary{padding:7px 1px;cursor:pointer;font-size:8px;font-weight:900;color:#647e82}.owner-detail-grid-v26{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:0 0 8px}.owner-detail-grid-v26>span{font-size:8px;color:#819397}.owner-detail-grid-v26 b{display:block;color:#425b60;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.owner-actions-v26{display:flex;gap:6px;margin-top:8px}.owner-actions-v26>.button,.owner-actions-v26>.owner-more-v26{flex:1}.owner-actions-v26 .button{min-height:32px;padding:6px 9px;font-size:8px}.owner-more-v26{position:relative}.owner-more-v26>summary{list-style:none;text-align:center;cursor:pointer}.owner-more-v26>summary::-webkit-details-marker{display:none}.owner-more-v26>div{position:absolute;left:0;bottom:38px;z-index:10;min-width:150px;background:#fff;border:1px solid var(--v26-line);border-radius:11px;padding:5px;box-shadow:0 15px 35px rgba(15,23,42,.15)}.owner-more-v26 a,.owner-more-v26 button{display:block;width:100%;text-align:right;border:0;background:transparent;padding:8px 9px;border-radius:7px;font-size:9px;text-decoration:none;color:#40595e}.owner-more-v26 a:hover,.owner-more-v26 button:hover{background:#f3f6f7}.owner-more-v26 .danger-link{color:#b42318} /* stays v26 */ .stay-v26-head .stay-rate-v26{min-width:260px;border:1px solid #d5ebe7;border-radius:15px;background:#f3fbf9;padding:12px 14px}.stay-rate-v26 span,.stay-rate-v26 b,.stay-rate-v26 small{display:block}.stay-rate-v26 span{font-size:9px;color:#64817e}.stay-rate-v26 b{font-size:13px;margin:4px 0;color:#0d6c65}.stay-rate-v26 small{font-size:8px;color:#78908e}.stay-open-v26{display:grid;gap:8px;margin-bottom:14px}.stay-open-v26 .stay-open-card{grid-template-columns:auto minmax(0,1fr) minmax(250px,auto);padding:13px 14px;border-radius:15px}.stay-form-v26{padding:16px 17px}.stay-form-v26 label{display:grid;gap:6px;color:#526d72;font-size:9px;font-weight:800}.stay-form-v26 input,.stay-form-v26 select,.stay-form-v26 textarea{width:100%;border:1px solid #d8e3e7;border-radius:11px;background:#fbfdfe;padding:10px 11px;outline:none}.stay-form-v26 input:focus,.stay-form-v26 select:focus,.stay-form-v26 textarea:focus{background:#fff;border-color:#6fc8bf;box-shadow:0 0 0 3px rgba(20,184,166,.08)}.stay-owner-picker-v26{display:grid;grid-template-columns:1fr 1.35fr;gap:10px;margin-bottom:11px}.stay-owner-known-v26{display:flex;align-items:center;gap:10px;padding:10px 11px;margin-bottom:11px;border:1px solid #dcebe8;border-radius:12px;background:#f5fbfa}.stay-owner-known-v26 .avatar{width:36px;height:36px;border-radius:11px}.stay-owner-known-v26 small,.stay-owner-known-v26 b{display:block}.stay-owner-known-v26 small{font-size:8px;color:#78908e}.stay-owner-known-v26 b{font-size:11px;margin-top:2px}.stay-facts-row-v26{display:grid;grid-template-columns:1.35fr 1.35fr .65fr .65fr;gap:9px}.stay-facts-row-v26 label>small{font-weight:500;color:#89999c}.stay-detection-v26{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:center;margin:11px 0;padding:10px 11px;border:1px solid #dde7ea;border-radius:12px;background:#f8fafb}.stay-detection-v26 .detect-icon{width:31px;height:31px;border-radius:9px;background:#e8f0f2;display:grid;place-items:center;color:#5e7a7e}.stay-detection-v26 b,.stay-detection-v26 p{display:block;margin:0}.stay-detection-v26 b{font-size:9px}.stay-detection-v26 p{font-size:8px;color:#73898d;margin-top:2px}.stay-detection-v26.ok{background:#effaf7;border-color:#c6e9e2}.stay-detection-v26.ok .detect-icon{background:#0f8e82;color:#fff}.stay-detection-v26.foreign,.stay-detection-v26.warning{background:#fff8ed;border-color:#f4d6a8}.stay-detection-v26.foreign .detect-icon,.stay-detection-v26.warning .detect-icon{background:#d99126;color:#fff}.stay-detection-v26.missing{background:#fff4f2;border-color:#f1cbc5}.stay-detection-v26.missing .detect-icon{background:#cc6658;color:#fff}.stay-detection-v26.loading .detect-icon{animation:v26Pulse 1s infinite alternate}@keyframes v26Pulse{to{opacity:.45}}.stay-manual-period-v26,.stay-manager-advanced{margin:10px 0;border:1px dashed #dbe4e7;border-radius:11px;background:#fafcfc}.stay-manual-period-v26 summary,.stay-manager-advanced summary{cursor:pointer;padding:10px 11px;font-size:9px;font-weight:900;color:#5b7478}.stay-manual-period-v26 summary small{font-weight:500;color:#8a9ca0}.stay-manual-period-v26>div,.stay-manager-advanced>div{padding:0 11px 11px}.stay-note-v26{margin-top:10px}.stay-submit-v26{display:flex;justify-content:space-between;align-items:center;gap:14px;margin:13px -17px -16px;padding:13px 17px;background:#f7fafb;border-top:1px solid var(--v26-line)}.stay-submit-v26>div:last-child{display:flex;gap:7px;flex-wrap:wrap}.stay-submit-v26 .stay-cost-preview span,.stay-submit-v26 .stay-cost-preview strong,.stay-submit-v26 .stay-cost-preview small{display:block}.stay-submit-v26 .stay-cost-preview span{font-size:8px;color:#768b8f}.stay-submit-v26 .stay-cost-preview strong{font-size:16px;color:#0b7169;margin:3px 0}.stay-submit-v26 .stay-cost-preview small{font-size:7.5px;color:#87999c}.stay-history-link-v26{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-top:14px;padding:14px 16px;border:1px solid var(--v26-line);border-radius:15px;background:#fff}.stay-history-link-v26 h2{font-size:14px;margin:3px 0 4px}.stay-history-link-v26 p{margin:0;color:var(--v26-muted);font-size:9px}.stay-foreign-confirm{margin:12px 0}.stay-manager-advanced{margin:10px 0} /* lottery */ .lottery-run-summary-v26{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-bottom:12px}.lottery-run-summary-v26>article{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#fff;border:1px solid var(--v26-line);border-radius:14px;padding:12px 14px;box-shadow:0 5px 18px rgba(15,23,42,.035)}.lottery-run-summary-v26 span,.lottery-run-summary-v26 b,.lottery-run-summary-v26 small{display:block}.lottery-run-summary-v26>article>div:first-child>span{font-size:8px;color:#0d766e;font-weight:900}.lottery-run-summary-v26>article>div:first-child>b{font-size:11px;margin:3px 0}.lottery-run-summary-v26>article>div:first-child>small{font-size:8px;color:var(--v26-muted)}.lottery-run-facts{display:flex;gap:6px}.lottery-run-facts>span{min-width:48px;text-align:center;padding:6px;border-radius:9px;background:#f5f8f9}.lottery-run-facts small{font-size:7px;color:#7e9195}.lottery-run-facts b{font-size:12px;margin-top:2px} /* seasonal one-sheet */ .season-print-sheet{background:#fff;border:1px solid var(--v26-line);border-radius:16px;padding:18px;box-shadow:var(--v26-shadow)}.season-print-sheet>header{text-align:center;margin-bottom:12px}.season-print-sheet>header h1{font-size:18px;margin:0 0 5px}.season-print-sheet>header p{margin:0;color:#657e82;font-size:10px}.season-print-sheet table{width:100%;border-collapse:collapse;table-layout:fixed}.season-print-sheet th,.season-print-sheet td{border:1px solid #dce5e8;padding:7px 6px;text-align:center;font-size:9px;vertical-align:middle}.season-print-sheet th{background:#edf6f4;color:#35575b;font-weight:900}.season-print-sheet th:first-child,.season-print-sheet td:first-child{width:42px}.season-print-sheet th:nth-child(2),.season-print-sheet td:nth-child(2){width:150px}.season-print-sheet th:nth-child(3),.season-print-sheet td:nth-child(3){width:65px} @media(max-width:1180px){.user-card-grid-v26,.owner-card-grid-v26{grid-template-columns:repeat(2,minmax(0,1fr))}.users-v26-tools,.owner-toolbar-controls-v26{min-width:min(560px,62%)}.report-filter-bar{grid-template-columns:repeat(3,minmax(150px,1fr))}.report-filter-bar .actions{grid-column:span 3}.accounting-chart-grid-v26{grid-template-columns:1fr 1fr}} @media(max-width:900px){.report-heading,.owner-heading-v26,.users-v26-head,.stay-v26-head{display:block}.report-heading .heading-actions,.owner-heading-v26 .actions,.users-v26-head .button,.stay-v26-head .stay-rate-v26{margin-top:11px}.user-tools-v26,.owner-list-toolbar-v26{display:block}.users-v26-tools,.owner-toolbar-controls-v26{min-width:0;width:100%;margin-top:10px}.report-kpi-grid,.user-stat-grid-v26,.owner-summary-v26{grid-template-columns:repeat(2,minmax(0,1fr))}.accounting-chart-grid-v26{grid-template-columns:1fr}.stay-facts-row-v26{grid-template-columns:1fr 1fr}.stay-open-v26 .stay-open-card{grid-template-columns:auto 1fr}.stay-open-v26 .stay-checkout-form{grid-column:1/-1}} @media(max-width:680px){.report-filter-bar{grid-template-columns:1fr 1fr;padding:11px}.report-filter-bar .actions{grid-column:1/-1}.report-filter-bar .actions>*{flex:1}.users-v26-tools,.owner-toolbar-controls-v26{grid-template-columns:1fr 1fr}.users-v26-tools .user-search,.owner-toolbar-controls-v26 .owner-search-v26{grid-column:1/-1}.user-card-grid-v26,.owner-card-grid-v26{grid-template-columns:1fr;padding:9px}.user-card-v26,.owner-card-v26{padding:11px}.user-primary-meta{grid-template-columns:1fr 1fr}.user-primary-meta>span:last-child{grid-column:1/-1}.stay-owner-picker-v26,.stay-facts-row-v26{grid-template-columns:1fr}.stay-submit-v26,.stay-history-link-v26{display:block}.stay-submit-v26>div:last-child{display:grid;grid-template-columns:1fr 1fr;margin-top:10px}.stay-history-link-v26 .button{width:100%;margin-top:10px}.lottery-run-summary-v26{grid-template-columns:1fr}.report-owner-list{grid-template-columns:1fr}.mobile-cards table{min-width:0}.mobile-cards thead{display:none}.mobile-cards tbody,.mobile-cards tr,.mobile-cards td{display:block;width:100%}.mobile-cards tr{padding:9px 11px;border-bottom:1px solid var(--v26-line)}.mobile-cards td{display:grid;grid-template-columns:95px minmax(0,1fr);gap:8px;border:0;padding:5px 0;text-align:right}.mobile-cards td:before{content:attr(data-label);color:#7c9195;font-size:8px;font-weight:800}.mobile-cards td[colspan]:before{display:none}.mobile-cards td[colspan]{display:block}.dual-month-chart-v26{height:170px}.dual-month-chart-v26>a>div{height:140px}.season-print-sheet{overflow:auto}} @media(max-width:480px){.report-kpi-grid,.user-stat-grid-v26,.owner-summary-v26{grid-template-columns:1fr 1fr}.user-stat,.owner-summary-v26>article,.report-kpi-grid>article{padding:11px}.users-v26-tools,.owner-toolbar-controls-v26{grid-template-columns:1fr}.users-v26-tools .user-search,.owner-toolbar-controls-v26 .owner-search-v26{grid-column:auto}.stay-submit-v26>div:last-child{grid-template-columns:1fr}.user-card-actions-v26,.owner-actions-v26{flex-wrap:wrap}.user-card-actions-v26>* ,.owner-actions-v26>*{min-width:calc(50% - 4px)}.lottery-run-summary-v26>article{display:block}.lottery-run-facts{margin-top:9px}.hbar-list-v26>a,.expense-mix-v26>div{grid-template-columns:95px 1fr}.hbar-list-v26>a>b,.expense-mix-v26>div>strong{grid-column:2;text-align:left}.report-filter-bar{grid-template-columns:1fr}.report-filter-bar .actions{grid-column:auto}} @media print{ .no-print,.app-sidebar,.topbar,.site-announcement-bar,.flash-container,.heading-actions,.report-filter-bar,.report-tabs{display:none!important} body,.app-shell,.main-content,.content-wrap{background:#fff!important;margin:0!important;padding:0!important;box-shadow:none!important} .season-print-sheet{border:0!important;border-radius:0!important;box-shadow:none!important;padding:0!important;margin:0!important;width:100%!important} .season-print-sheet>header{margin-bottom:6mm}.season-print-sheet>header h1{font-size:14pt}.season-print-sheet>header p{font-size:8pt} .season-print-sheet table{font-size:7.3pt;page-break-inside:avoid}.season-print-sheet th,.season-print-sheet td{padding:2.3mm 1.5mm;font-size:7.3pt;line-height:1.25}.season-print-sheet tr{page-break-inside:avoid} .report-table-panel{border:0!important;box-shadow:none!important}.report-table-panel table{min-width:0}.report-table-panel th,.report-table-panel td{font-size:8pt;padding:2mm} } /* v31: direct allocation target from calendar */ .allocation-target-row{outline:2px solid rgba(84,112,214,.16);outline-offset:-2px;background:#fbfcff!important} .allocation-target-row.allocation-target-ready{animation:allocation-target-pulse 1.1s ease 1} @keyframes allocation-target-pulse{0%,100%{box-shadow:inset 0 0 0 0 rgba(84,112,214,0)}45%{box-shadow:inset 0 0 0 3px rgba(84,112,214,.16)}} /* ===== hammelk-report-system-v27.css ===== */ /* Hammelk Report Design System v27 Shared, print-safe report viewer inspired by the Auto Gallery report system. */ :root{ --hmr-ink:#10263f; --hmr-muted:#6b7c90; --hmr-primary:#245fc7; --hmr-primary-dark:#163f82; --hmr-accent:#0f766e; --hmr-line:#cfd9e6; --hmr-line-strong:#9fb0c4; --hmr-soft:#f3f7fb; --hmr-paper:#fff; --hmr-viewer:#eaf0f6; --hmr-shadow:0 18px 48px rgba(15,35,62,.16); --hmr-radius:14px; --hmr-zoom:1; } /* viewer + toolbar */ .hmr-viewer{width:100%;margin:0;direction:rtl} .hmr-toolbar{position:sticky;top:8px;z-index:70;display:flex;align-items:center;gap:8px;flex-wrap:wrap;width:min(100%,297mm);margin:0 auto 12px;padding:9px;border:1px solid #d6e0eb;border-radius:14px;background:rgba(255,255,255,.97);box-shadow:0 8px 24px rgba(15,35,62,.10);backdrop-filter:blur(10px)} .hmr-toolbar-group{display:flex;align-items:center;gap:6px;flex-wrap:wrap} .hmr-toolbar-spacer{flex:1} .hmr-tool{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:7px 12px;border:1px solid #d5dfeb;border-radius:10px;background:#fff;color:var(--hmr-primary-dark);font:inherit;font-weight:850;text-decoration:none;cursor:pointer;white-space:nowrap} .hmr-tool:hover{border-color:#9fb7d5;background:#f7fbff;color:#0f376f} .hmr-tool.primary{background:var(--hmr-primary);border-color:var(--hmr-primary);color:#fff;box-shadow:0 6px 16px rgba(36,95,199,.18)} .hmr-tool.compact{min-width:38px;padding-inline:8px;font-size:18px} .hmr-zoom-label{min-width:50px;text-align:center;color:var(--hmr-muted);font-size:11px;font-weight:900} .hmr-stage{display:flex;justify-content:center;align-items:flex-start;width:100%;padding:18px;border:1px solid #dde5ee;border-radius:18px;background:var(--hmr-viewer);overflow:auto} .hmr-paper{position:relative;box-sizing:border-box;width:210mm;min-height:297mm;margin:0 auto;padding:11mm;background:var(--hmr-paper);color:var(--hmr-ink);box-shadow:var(--hmr-shadow);font-family:var(--app-font-family,Vazirmatn,Tahoma,Arial,sans-serif);font-size:11.5px;line-height:1.65;zoom:var(--hmr-zoom)} .hmr-paper[data-orientation="landscape"]{width:297mm;min-height:210mm;padding:8.5mm;page:hmr-landscape} .hmr-paper[data-orientation="portrait"]{page:hmr-portrait} /* shared report identity */ .hmr-report-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:9px 11px;margin-bottom:9px;border:1.5px solid var(--hmr-primary-dark);border-radius:12px;break-inside:avoid;background:#fff} .hmr-report-heading{display:flex;align-items:center;gap:10px;min-width:0} .hmr-report-mark{display:grid;place-items:center;flex:0 0 42px;width:42px;height:42px;border-radius:11px;background:linear-gradient(145deg,#eef4ff,#e3edf9);border:1px solid #c6d7ec;color:var(--hmr-primary-dark);font-size:19px;font-weight:950} .hmr-report-brand{margin-bottom:2px;color:var(--hmr-accent);font-size:9px;font-weight:950} .hmr-report-title{margin:0;color:var(--hmr-primary-dark);font-size:18px;line-height:1.35;font-weight:950} .hmr-report-subtitle{margin:4px 0 0;color:var(--hmr-muted);font-size:9.5px;line-height:1.7} .hmr-report-meta{display:grid;gap:4px;min-width:190px} .hmr-report-meta>div{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:3px 0;border-bottom:1px dashed #e1e7ef;font-size:9px} .hmr-report-meta>div:last-child{border-bottom:0} .hmr-report-meta span{color:var(--hmr-muted)} .hmr-report-meta b{color:var(--hmr-ink);font-weight:900;text-align:left} .hmr-report-section{margin-top:10px;break-inside:auto} .hmr-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin:0 0 6px;break-after:avoid} .hmr-section-head h2{margin:0;color:var(--hmr-primary-dark);font-size:12.5px;font-weight:950} .hmr-section-head p{margin:2px 0 0;color:var(--hmr-muted);font-size:8.8px} .hmr-section-head .hmr-count{color:var(--hmr-muted);font-size:8.5px;font-weight:850;white-space:nowrap} .hmr-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin:8px 0 10px;break-inside:avoid} .hmr-summary>article{padding:7px 8px;border:1px solid var(--hmr-line);border-radius:9px;background:#fff;text-align:center} .hmr-summary span,.hmr-summary small{display:block;color:var(--hmr-muted);font-size:8.2px} .hmr-summary strong{display:block;margin:2px 0;color:var(--hmr-primary-dark);font-size:14px;font-weight:950} .hmr-summary small{font-size:7.5px} .hmr-table-wrap{width:100%;overflow:visible} .hmr-table{width:100%;border-collapse:collapse;table-layout:fixed;font-variant-numeric:tabular-nums} .hmr-table th,.hmr-table td{border:1px solid var(--hmr-line-strong);padding:5px 5px;text-align:right;vertical-align:middle;overflow-wrap:anywhere} .hmr-table th{background:#eaf0f7;color:#173d6d;font-size:9px;font-weight:950;text-align:center} .hmr-table td{font-size:9px;background:#fff} .hmr-table tbody tr:nth-child(even) td{background:#f9fbfd} .hmr-table .center{text-align:center} .hmr-table .nowrap{white-space:nowrap;overflow-wrap:normal} .hmr-table .money{direction:ltr;text-align:center;white-space:nowrap;font-weight:850} .hmr-table .muted-cell{color:var(--hmr-muted)} .hmr-table thead{display:table-header-group} .hmr-table tfoot{display:table-footer-group} .hmr-table tr{break-inside:avoid;page-break-inside:avoid} .hmr-empty{padding:18px 12px;text-align:center;color:var(--hmr-muted);border:1px dashed var(--hmr-line);border-radius:10px;background:#fafcff} .hmr-status{display:inline-flex;align-items:center;justify-content:center;padding:3px 7px;border-radius:999px;background:#eef3f8;color:#486078;font-size:8px;font-weight:900;white-space:nowrap} .hmr-status.active{background:#e8f7ef;color:#14734a}.hmr-status.used{background:#e8f0ff;color:#2757a5}.hmr-status.changed{background:#fff7df;color:#8a6500}.hmr-status.cancelled{background:#fff0f0;color:#a83434} /* report-specific reusable blocks */ .hmr-season-paper{display:flex;flex-direction:column} .hmr-season-paper .hmr-report-head{margin-bottom:7px} .hmr-season-table col.col-row{width:5%} .hmr-season-table col.col-date{width:22%} .hmr-season-table col.col-nights{width:8%} .hmr-season-table col.col-suite{width:18%} .hmr-season-table col.col-owner{width:29%} .hmr-season-table th,.hmr-season-table td{padding:6px 5px;text-align:center;font-size:9.4px;line-height:1.45} .hmr-season-table th{font-size:9px} .hmr-season-table td.date-cell{direction:rtl;white-space:nowrap;font-weight:800;color:#233f61} .hmr-season-table td.owner-cell{font-weight:850;color:#173d6d} .hmr-season-paper.hmr-density-compact .hmr-season-table th,.hmr-season-paper.hmr-density-compact .hmr-season-table td{padding:4px 4px;font-size:8.5px;line-height:1.3} .hmr-season-paper.hmr-density-tight .hmr-season-table th,.hmr-season-paper.hmr-density-tight .hmr-season-table td{padding:3px 3px;font-size:7.8px;line-height:1.22} .hmr-rights-season-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:7px 0 10px;break-inside:avoid} .hmr-rights-season-grid>article{padding:6px 7px;border:1px solid var(--hmr-line);border-radius:8px;background:#fff} .hmr-rights-season-grid span,.hmr-rights-season-grid b,.hmr-rights-season-grid small{display:block} .hmr-rights-season-grid span{color:var(--hmr-primary-dark);font-weight:900;font-size:8.5px}.hmr-rights-season-grid b{margin:2px 0;font-size:8.5px}.hmr-rights-season-grid small{color:var(--hmr-muted);font-size:7.5px} .hmr-rights-season-grid .used{background:#f4fbf7;border-color:#b9dcc8}.hmr-rights-season-grid .unused{background:#fffaf0;border-color:#ead8a9} .hmr-lottery-table col.c-run{width:8%}.hmr-lottery-table col.c-period{width:12%}.hmr-lottery-table col.c-winner{width:14%}.hmr-lottery-table col.c-share{width:12%}.hmr-lottery-table col.c-date{width:17%}.hmr-lottery-table col.c-suite{width:10%}.hmr-lottery-table col.c-status{width:10%}.hmr-lottery-table col.c-change{width:17%} .hmr-accounting-table col.c-date{width:12%}.hmr-accounting-table col.c-account{width:23%}.hmr-accounting-table col.c-type{width:10%}.hmr-accounting-table col.c-amount{width:14%}.hmr-accounting-table col.c-reference{width:14%}.hmr-accounting-table col.c-desc{width:27%} .hmr-report-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:10px;padding-top:6px;border-top:1px solid #dce4ed;color:var(--hmr-muted);font-size:7.8px;break-inside:avoid} .hmr-season-paper .hmr-report-footer{margin-top:auto;padding-top:7px} @page hmr-portrait{size:A4 portrait;margin:0} @page hmr-landscape{size:A4 landscape;margin:0} @media screen and (max-width:900px){ .hmr-toolbar{top:4px;width:calc(100% - 12px);margin-inline:6px}.hmr-toolbar-spacer{display:none} .hmr-stage{justify-content:flex-start;padding:10px;border-radius:12px} .hmr-summary{grid-template-columns:repeat(2,minmax(0,1fr))} } @media screen and (max-width:620px){ .hmr-toolbar-group.hmr-toolbar-view{order:3;width:100%}.hmr-report-head{flex-direction:column}.hmr-report-meta{width:100%;min-width:0} .hmr-stage{padding:7px}.hmr-paper{zoom:var(--hmr-zoom)} } @media print{ *{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important} html,body{margin:0!important;padding:0!important;background:#fff!important;width:auto!important;min-height:auto!important;overflow:visible!important} .sidebar,.sidebar-backdrop,.topbar,.site-announcement-bar,.mobile-dock,.toast-stack,.hmr-toolbar,.report-filter-bar,.report-tabs,.page-heading,.heading-actions,.accounting-chart-grid-v26,.lottery-run-summary-v26,.no-print{display:none!important} .app-shell,.workspace,.page-content,.hmr-viewer,.hmr-stage{display:block!important;width:auto!important;min-width:0!important;max-width:none!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;background:#fff!important;box-shadow:none!important;overflow:visible!important} .workspace{margin-right:0!important} .hmr-paper{zoom:1!important;transform:none!important;margin:0!important;border:0!important;border-radius:0!important;box-shadow:none!important;background:#fff!important;width:210mm!important;min-height:297mm!important;padding:10mm!important;font-size:10.5pt!important;line-height:1.5!important} .hmr-paper[data-orientation="landscape"]{width:297mm!important;min-height:210mm!important;padding:7.5mm!important} .hmr-report-head{padding:3.2mm 3.5mm!important;margin-bottom:2.5mm!important;border-radius:3mm!important} .hmr-report-title{font-size:13.2pt!important}.hmr-report-subtitle{font-size:7.5pt!important}.hmr-report-brand{font-size:7pt!important}.hmr-report-mark{width:10mm!important;height:10mm!important;flex-basis:10mm!important;font-size:12pt!important} .hmr-report-meta{min-width:48mm!important}.hmr-report-meta>div{font-size:6.8pt!important;padding:.6mm 0!important} .hmr-summary{gap:1.7mm!important;margin:2mm 0 2.5mm!important}.hmr-summary>article{padding:1.5mm!important;border-radius:2mm!important}.hmr-summary span{font-size:6.5pt!important}.hmr-summary strong{font-size:10pt!important}.hmr-summary small{font-size:6pt!important} .hmr-section-head{margin-bottom:1.7mm!important}.hmr-section-head h2{font-size:9pt!important}.hmr-section-head p,.hmr-section-head .hmr-count{font-size:6.6pt!important} .hmr-table th,.hmr-table td{padding:1.6mm 1.2mm!important;font-size:7.4pt!important;line-height:1.28!important}.hmr-table th{font-size:7pt!important} .hmr-season-table th,.hmr-season-table td{padding:2.15mm 1.3mm!important;font-size:8.2pt!important;line-height:1.3!important}.hmr-season-table th{font-size:7.6pt!important} .hmr-season-paper.hmr-density-compact .hmr-season-table th,.hmr-season-paper.hmr-density-compact .hmr-season-table td{padding:1.55mm 1.1mm!important;font-size:7.3pt!important} .hmr-season-paper.hmr-density-tight .hmr-season-table th,.hmr-season-paper.hmr-density-tight .hmr-season-table td{padding:1.05mm .9mm!important;font-size:6.6pt!important} .hmr-rights-season-grid{gap:1.5mm!important;margin:1.7mm 0 2.2mm!important}.hmr-rights-season-grid>article{padding:1.4mm!important;border-radius:2mm!important}.hmr-rights-season-grid span,.hmr-rights-season-grid b{font-size:6.7pt!important}.hmr-rights-season-grid small{font-size:6pt!important} .hmr-report-footer{margin-top:2.5mm!important;padding-top:1.7mm!important;font-size:6.2pt!important} .hmr-status{padding:.7mm 1.4mm!important;font-size:6.2pt!important} a{color:inherit!important;text-decoration:none!important} } /* ===== hammelk-v32-core-mobile.css ===== */ /* v32 — core workflow + mobile-first completion layer */ :root{ --hm-app-radius:22px; --hm-sheet-radius:26px; --hm-touch:44px; } /* Allocation is a workflow, not a tiny table-cell form. */ .allocation-panel-row[hidden]{display:none!important} .allocation-panel-row>td{padding:14px 16px!important;background:rgba(15,23,42,.035)} .allocation-panel-shell{border:1px solid rgba(15,23,42,.10);border-radius:20px;background:#fff;box-shadow:0 18px 44px rgba(15,23,42,.10);overflow:visible} .allocation-panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:18px 20px 14px;border-bottom:1px solid rgba(15,23,42,.08)} .allocation-panel-head h3{margin:3px 0 4px;font-size:1.08rem} .allocation-panel-head p{margin:0;color:var(--muted,#64748b);font-size:.88rem} .allocation-panel-close{width:40px;height:40px;border:0;border-radius:13px;background:rgba(15,23,42,.06);font-size:1.6rem;line-height:1;cursor:pointer;flex:0 0 auto} .allocation-panel-form{display:grid;grid-template-columns:minmax(260px,1.35fr) minmax(300px,1.65fr);gap:16px 20px;padding:18px 20px 20px;align-items:start} .allocation-panel-form label>span:first-child,.allocation-owner-field>span,.allocation-reason-field>span{display:block;font-weight:800;margin-bottom:7px} .allocation-owner-field select,.allocation-reason-field input{width:100%;min-height:46px} .allocation-owner-field small{display:block;margin-top:6px;color:var(--muted,#64748b);font-size:.78rem} .allocation-option-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;grid-column:1/-1} .allocation-check{display:flex!important;align-items:flex-start;gap:9px;padding:12px;border:1px solid rgba(15,23,42,.10);border-radius:15px;background:rgba(248,250,252,.9);cursor:pointer} .allocation-check input{margin-top:3px;flex:0 0 auto} .allocation-check span{display:block;margin:0!important} .allocation-check b,.allocation-check small{display:block} .allocation-check small{margin-top:3px;color:var(--muted,#64748b);font-weight:500;line-height:1.6} .allocation-reason-field{grid-column:1/-1} .allocation-panel-actions{grid-column:1/-1;display:flex;justify-content:flex-end;gap:10px;padding-top:2px} .allocation-target-ready{outline:2px solid rgba(37,99,235,.20);outline-offset:-2px} /* Annual lottery: show the whole-year plan before committing it. */ .annual-lottery-status{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:16px 0} .annual-lottery-status>div,.annual-season-grid article{border:1px solid rgba(15,23,42,.09);border-radius:18px;background:rgba(248,250,252,.82);padding:14px 16px} .annual-lottery-status span,.annual-lottery-status small,.annual-season-grid small{display:block;color:var(--muted,#64748b);font-size:.78rem} .annual-lottery-status b{display:block;font-size:1.35rem;margin:4px 0} .annual-lottery-status.has-shortage>div:nth-child(2){border-color:rgba(217,119,6,.28);background:rgba(255,251,235,.85)} .annual-season-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:14px 0} .annual-season-grid article header{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-bottom:9px;margin-bottom:9px;border-bottom:1px solid rgba(15,23,42,.08)} .annual-season-grid article header span{font-size:.76rem;color:var(--muted,#64748b)} .annual-season-grid article>div{display:flex;justify-content:space-between;gap:8px;align-items:center;margin-top:6px} .annual-season-grid strong{font-size:1rem} .annual-plan-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding-top:12px} .annual-plan-list>div{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid rgba(15,23,42,.08);border-radius:13px;padding:10px 12px;background:#fff} .annual-plan-list span{color:var(--muted,#64748b);font-size:.8rem;text-align:left} .annual-shortage-box{margin-top:14px;border:1px solid rgba(217,119,6,.25);background:rgba(255,251,235,.9);border-radius:18px;padding:14px 16px} .annual-shortage-box h3{margin:0 0 4px;font-size:1rem}.annual-shortage-box p{margin:0 0 10px;color:#92400e;font-size:.84rem} .annual-shortage-list{display:grid;gap:7px}.annual-shortage-list>div{display:grid;grid-template-columns:minmax(140px,1fr) minmax(130px,1fr) 2fr;gap:10px;align-items:center;padding:9px 10px;border-radius:12px;background:rgba(255,255,255,.78)} .annual-shortage-list small{color:#92400e} .special-quota-policy-note{margin:0 0 14px;padding:11px 13px;border-radius:13px;background:rgba(37,99,235,.06);border:1px solid rgba(37,99,235,.12);font-size:.84rem} /* App-like interaction defaults shared by owner and management mobile views. */ @media (max-width:900px){ html{scroll-padding-bottom:92px} body{overscroll-behavior-y:contain} body.allocation-sheet-open{overflow:hidden} .page-content{padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))!important} .page-heading{gap:12px!important;margin-bottom:14px!important} .page-heading h1{font-size:1.35rem!important;line-height:1.45!important} .page-heading p{font-size:.84rem!important;line-height:1.8!important} .heading-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;gap:8px!important} .heading-actions>.button,.heading-actions>button{width:100%;min-height:var(--hm-touch);justify-content:center} .panel{border-radius:var(--hm-app-radius)!important} .panel-head{gap:10px!important;align-items:flex-start!important} .panel-head h2{font-size:1.05rem!important} .button,button.button,a.button{min-height:var(--hm-touch)} input:not([type=checkbox]):not([type=radio]),select,textarea{min-height:var(--hm-touch)} .form-grid{grid-template-columns:1fr!important;gap:12px!important} .form-grid>.wide,.form-grid>.full{grid-column:auto!important} .form-grid .actions{display:grid!important;grid-template-columns:1fr!important} .form-grid .actions>.button{width:100%} details>summary{min-height:var(--hm-touch);display:flex;align-items:center} .table-wrap.mobile-cards table tbody tr{border-radius:18px!important} .table-wrap.mobile-cards td.actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px!important} .table-wrap.mobile-cards td.actions::before{grid-column:1/-1} .table-wrap.mobile-cards td.actions>.button,.table-wrap.mobile-cards td.actions>form,.table-wrap.mobile-cards td.actions>details{width:100%!important;max-width:none!important} .table-wrap.mobile-cards td.actions form>.button,.table-wrap.mobile-cards td.actions details>summary{width:100%!important;justify-content:center!important} /* Full-screen backdrop + bottom sheet for period allocation. */ .allocation-panel-row.is-open{position:fixed!important;inset:0!important;z-index:2600!important;display:flex!important;align-items:flex-end!important;justify-content:stretch!important;margin:0!important;padding:0!important;background:rgba(15,23,42,.48)!important;backdrop-filter:blur(3px)} .allocation-panel-row.is-open>td{display:block!important;width:100%!important;max-width:none!important;padding:0!important;border:0!important;background:transparent!important} .allocation-panel-row.is-open>td::before{display:none!important} .allocation-panel-shell{width:100%;max-height:min(90svh,760px);overflow:auto;border:0;border-radius:var(--hm-sheet-radius) var(--hm-sheet-radius) 0 0;box-shadow:0 -24px 70px rgba(15,23,42,.25);padding-bottom:env(safe-area-inset-bottom,0px)} .allocation-panel-head{position:sticky;top:0;z-index:2;background:rgba(255,255,255,.97);backdrop-filter:blur(12px);padding:15px 16px 12px} .allocation-panel-head::before{content:"";position:absolute;top:6px;left:50%;width:42px;height:4px;border-radius:99px;background:rgba(100,116,139,.28);transform:translateX(-50%)} .allocation-panel-head h3{font-size:1.05rem}.allocation-panel-head p{font-size:.8rem} .allocation-panel-form{display:block;padding:14px 16px 18px} .allocation-owner-field,.allocation-reason-field{display:block;margin-bottom:14px} .allocation-option-grid{display:grid;grid-template-columns:1fr;gap:8px;margin-bottom:14px} .allocation-check{min-height:58px;align-items:center} .allocation-panel-actions{position:sticky;bottom:0;display:grid;grid-template-columns:.8fr 1.2fr;gap:8px;margin:0 -16px -18px;padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px));background:rgba(255,255,255,.96);backdrop-filter:blur(12px);border-top:1px solid rgba(15,23,42,.08)} .allocation-panel-actions>.button{width:100%} .annual-lottery-status{grid-template-columns:1fr 1fr}.annual-lottery-status>div:first-child{grid-column:1/-1} .annual-season-grid{grid-template-columns:1fr 1fr} .annual-plan-list{grid-template-columns:1fr}.annual-plan-list>div{display:block}.annual-plan-list span{display:block;text-align:right;margin-top:3px} .annual-shortage-list>div{grid-template-columns:1fr}.annual-shortage-list span,.annual-shortage-list small{display:block} .lottery-quarter-mode{display:grid!important;grid-template-columns:1fr!important} .lottery-run-form .button{width:100%} .special-group-selector{display:grid!important;grid-template-columns:1fr!important} .special-group-selector .button{width:100%} } @media (max-width:520px){ .heading-actions{grid-template-columns:1fr!important} .table-wrap.mobile-cards td.actions{grid-template-columns:1fr!important} .annual-season-grid,.annual-lottery-status{grid-template-columns:1fr} .annual-lottery-status>div:first-child{grid-column:auto} } /* ===== hammelk-v33-stay-flow.css ===== */ /* Hammelk v33 — owner stay flow: one clear action per step */ .owner-stay-flow-v33{max-width:760px;margin:0 auto;padding:4px 0 20px}.owner-stay-head-v33{margin:0 0 12px}.owner-stay-head-v33 span{display:inline-flex;align-items:center;min-height:28px;padding:4px 10px;border-radius:999px;background:#edf4ff;color:#4d6fb4;font-size:12px;font-weight:800}.owner-stay-head-v33 h1{margin:8px 0 0;font-size:clamp(24px,6vw,34px);line-height:1.35;color:#16233b}.owner-stay-card-v33{display:grid;gap:16px;background:#fff;border:1px solid #dfe7ee;border-radius:24px;padding:18px;box-shadow:0 12px 30px rgba(35,55,80,.06)}.owner-stay-person-v33,.owner-stay-state-v33{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:18px;background:#f4faf9;border:1px solid #dbece8}.owner-stay-person-v33 .avatar,.owner-stay-state-v33>span{width:46px;height:46px;border-radius:15px;display:grid;place-items:center;background:#fff;border:1px solid #d8e4e5;color:#275d65;font-size:20px;font-weight:900;flex:0 0 auto}.owner-stay-person-v33 small,.owner-stay-person-v33 b,.owner-stay-state-v33 small,.owner-stay-state-v33 b{display:block}.owner-stay-person-v33 small,.owner-stay-state-v33 small{font-size:12px;color:#72848a;margin-bottom:3px}.owner-stay-person-v33 b,.owner-stay-state-v33 b{font-size:16px;color:#1d2e38}.owner-stay-now-v33{margin:0;padding:0;border:0}.owner-stay-now-v33 legend{font-size:18px;font-weight:900;color:#223043;margin-bottom:10px}.owner-stay-choice-v33{display:grid;grid-template-columns:1fr 1fr;gap:10px}.owner-stay-choice-v33 label{position:relative;cursor:pointer}.owner-stay-choice-v33 input{position:absolute;opacity:0;pointer-events:none}.owner-stay-choice-v33 span{display:grid;place-items:center;min-height:54px;padding:10px 12px;border:1px solid #d7e0e8;border-radius:16px;background:#fff;color:#516175;font-size:15px;font-weight:800;transition:.16s ease}.owner-stay-choice-v33 input:checked+span{background:#eaf0ff;border-color:#6b8ddd;color:#315cad;box-shadow:0 0 0 3px rgba(95,132,220,.1)}.owner-stay-now-hint-v33{margin:8px 2px 0;color:#7c8996;font-size:12px;line-height:1.8}.owner-stay-manual-v33{display:grid;grid-template-columns:1.25fr .75fr;gap:10px;padding:12px;border-radius:18px;background:#f8fafc;border:1px solid #e4e9ef}.owner-stay-manual-v33[hidden]{display:none!important}.owner-stay-manual-v33 label,.owner-stay-counts-v33 label{display:grid;gap:7px;font-size:13px;font-weight:800;color:#526374}.owner-stay-manual-v33 input,.owner-stay-counts-v33 input,.pledge-question-v33 input,.pledge-question-v33 select,.pledge-question-v33 textarea{width:100%;min-height:52px;border:1px solid #d8e1e8;border-radius:15px;background:#fff;padding:11px 13px;color:#17263a;font:inherit;outline:none}.owner-stay-manual-v33 input:focus,.owner-stay-counts-v33 input:focus,.pledge-question-v33 input:focus,.pledge-question-v33 select:focus,.pledge-question-v33 textarea:focus{border-color:#6c8fe0;box-shadow:0 0 0 3px rgba(91,126,211,.1)}.owner-stay-counts-v33{display:grid;grid-template-columns:1fr 1fr;gap:10px}.owner-stay-main-action-v33{width:100%;min-height:58px;border-radius:17px!important;font-size:17px!important;font-weight:900!important;display:grid!important;place-items:center}.owner-stay-message-v33{padding:13px 15px;border-radius:16px;border:1px solid #dce5ed;background:#f7fafc;color:#506274;font-size:13px;line-height:1.9}.owner-stay-message-v33.danger{background:#fff5f3;border-color:#f0d1cb;color:#9a4c42}.owner-stay-message-v33.warning{background:#fff9ed;border-color:#efdeb9;color:#8a6a2e}.owner-stay-message-v33.info{background:#f2f8ff;border-color:#d7e7fb;color:#49647d}.owner-stay-foreign-v33{padding:14px;border:1px solid #efd4a8;background:#fff9ef;border-radius:18px}.owner-stay-foreign-title-v33{display:flex;gap:10px;align-items:center}.owner-stay-foreign-title-v33>span{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:#d98d2a;color:#fff;font-weight:900}.owner-stay-foreign-title-v33 b,.owner-stay-foreign-title-v33 small{display:block}.owner-stay-foreign-title-v33 b{font-size:14px;color:#704f1f}.owner-stay-foreign-title-v33 small{margin-top:3px;color:#8b744f}.owner-stay-foreign-v33 p{margin:13px 0 8px;font-size:13px;font-weight:900;color:#5e4b31}.owner-stay-foreign-v33>small{display:block;margin-top:10px;color:#856f50;line-height:1.8}.owner-stay-inline-options-v33{display:flex;flex-wrap:wrap;gap:8px}.owner-stay-inline-options-v33 label{display:flex;align-items:center;gap:6px;min-height:42px;padding:8px 12px;background:#fff;border:1px solid #ead8ba;border-radius:12px;font-size:13px;font-weight:800}.pledge-page-v33{max-width:720px}.pledge-form-v33{display:grid;gap:14px}.pledge-question-v33{display:grid;gap:8px;padding:14px;border:1px solid #e0e7ed;border-radius:18px;background:#fbfcfd}.pledge-prompt-v33{font-size:14px;font-weight:900;color:#263548;line-height:1.9}.pledge-prompt-v33 span{color:#c55248}.pledge-question-v33.has-error{border-color:#e8b4ae;background:#fff8f7}.pledge-error-v33{color:#b34f45}.pledge-checkbox-v33{display:flex;align-items:center;gap:8px;min-height:50px;padding:10px 12px;border:1px solid #d8e1e8;border-radius:14px;background:#fff}.pledge-checkbox-v33 input{width:auto!important;min-height:0!important}.pledge-empty-v33{display:grid;gap:14px} @media(max-width:680px){.owner-stay-flow-v33{padding:0 2px 18px}.owner-stay-card-v33{padding:14px;border-radius:21px}.owner-stay-head-v33{padding:0 4px}.owner-stay-head-v33 h1{font-size:27px}.owner-stay-manual-v33,.owner-stay-counts-v33{grid-template-columns:1fr 1fr}.owner-stay-choice-v33 span{min-height:56px}.owner-stay-main-action-v33{min-height:60px}.owner-stay-person-v33,.owner-stay-state-v33{padding:11px 12px}.pledge-question-v33{padding:12px}} @media(max-width:430px){.owner-stay-manual-v33{grid-template-columns:1fr}.owner-stay-counts-v33{grid-template-columns:1fr 1fr}.owner-stay-choice-v33{grid-template-columns:1fr 1fr;gap:8px}.owner-stay-choice-v33 span{font-size:14px;padding-inline:8px}.owner-stay-card-v33{gap:14px}} /* ===== hammelk-suite-colors-v37.css ===== */ /* v37 - polished suite color picker: compact trigger + search inside dropdown */ .smart-suite-color-picker{position:relative;display:block;width:100%} .smart-suite-color-picker .suite-color-value{display:none!important} .smart-suite-color-picker .suite-color-trigger{ width:100%;height:54px;display:flex;align-items:center;justify-content:space-between;gap:12px; padding:0 16px;border:1px solid #d6e0eb;border-radius:13px;background:#fff;color:#243244; font:inherit;font-weight:800;cursor:pointer;text-align:right;transition:border-color .16s ease,box-shadow .16s ease,background .16s ease } .smart-suite-color-picker .suite-color-trigger:hover{border-color:#b9c9da;background:#fcfdff} .smart-suite-color-picker.open .suite-color-trigger, .smart-suite-color-picker .suite-color-trigger:focus-visible{border-color:#68b8aa;box-shadow:0 0 0 4px rgba(20,184,166,.09);outline:none} .suite-color-trigger-main{display:flex;align-items:center;gap:11px;min-width:0;flex:1} .suite-color-trigger-name{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .suite-color-trigger-swatch{ width:24px;height:24px;flex:0 0 24px;border-radius:50%;background:var(--suite-selected-color,#e2e8f0); border:1px solid rgba(15,23,42,.18);box-shadow:0 0 0 3px rgba(148,163,184,.10) } .suite-color-trigger-chevron{width:24px;height:24px;display:grid;place-items:center;flex:0 0 24px;color:#718096;font-size:18px;line-height:1;transition:transform .18s ease} .smart-suite-color-picker.open .suite-color-trigger-chevron{transform:rotate(180deg)} .suite-color-dropdown{ display:none;position:absolute;z-index:4200;top:calc(100% + 8px);right:0;left:0;max-height:min(430px,62vh);overflow:hidden; background:#fff;border:1px solid #cbd5e1;border-radius:16px;box-shadow:0 20px 48px rgba(15,35,70,.18) } .smart-suite-color-picker.open .suite-color-dropdown{display:flex;flex-direction:column} .suite-color-dropdown-head{display:flex;align-items:center;gap:9px;padding:10px 12px;border-bottom:1px solid #edf2f7;background:#fff;flex:0 0 auto} .suite-color-dropdown-head .palette-icon{width:30px;height:30px;border-radius:10px;display:grid;place-items:center;background:#eefaf6;color:#0f766e;font-size:16px} .suite-color-dropdown-head>div{display:grid;gap:2px;min-width:0}.suite-color-dropdown-head b{font-size:12px;color:#1f3a5f}.suite-color-dropdown-head small{font-size:10px;color:#64748b} .suite-color-dropdown-close{margin-right:auto;width:30px;height:30px;border:0;border-radius:9px;background:#f3f6f9;color:#64748b;cursor:pointer;font-size:18px;line-height:1} .suite-color-filter-wrap{position:relative;padding:10px 10px 8px;background:#fff;flex:0 0 auto} .suite-color-filter{width:100%;height:42px;padding:0 39px 0 12px;border:1px solid #dde5ee;border-radius:11px;background:#f9fbfd;color:#243244;outline:none;font:inherit;font-size:12px;font-weight:700} .suite-color-filter:focus{border-color:#68b8aa;box-shadow:0 0 0 3px rgba(20,184,166,.08);background:#fff} .suite-color-filter-icon{position:absolute;right:23px;top:50%;transform:translateY(-43%);color:#8794a7;font-size:15px;pointer-events:none} .suite-color-options{padding:2px 7px 7px;overflow:auto;overscroll-behavior:contain;min-height:0} .suite-color-option{display:flex;align-items:center;gap:10px;width:100%;padding:10px 11px;border:0;border-bottom:1px solid #f1f5f9;border-radius:11px;background:#fff;color:#183153;text-align:right;cursor:pointer;font:inherit} .suite-color-option:last-child{border-bottom:0}.suite-color-option:hover,.suite-color-option.smart-active{background:#eef8f4;color:#0f5132}.suite-color-option[aria-selected="true"]{background:#f0fbf7;color:#0f6c57;font-weight:900} .suite-color-swatch{width:21px;height:21px;flex:0 0 21px;border-radius:50%;background:var(--suite-option-color,#e2e8f0);border:1px solid rgba(15,23,42,.20);box-shadow:0 0 0 3px color-mix(in srgb,var(--suite-option-color,#94a3b8) 12%,transparent)} .suite-color-option-name{min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.suite-color-check{width:22px;height:22px;display:grid;place-items:center;border-radius:8px;color:#0f766e;opacity:0}.suite-color-option[aria-selected="true"] .suite-color-check{opacity:1} .suite-color-empty{padding:20px 12px;text-align:center;color:#64748b;font-size:12px} .suite-color-dropdown-foot{padding:8px 10px;color:#8290a2;font-size:10px;text-align:center;border-top:1px solid #f1f5f9;background:#fbfcfe;flex:0 0 auto} .suite-field .suite-dot{background:var(--suite-color,#82bea3)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--suite-color,#82bea3) 15%,transparent)} .suite-field .suite-color-caption{display:flex;align-items:center;justify-content:space-between;gap:8px;color:#64748b;font-size:11px;font-weight:800}.suite-field .suite-color-caption small{font-size:10px;color:#94a3b8} .suite-overview-item .suite-color-dot{background:var(--suite-color,#82bea3)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--suite-color,#82bea3) 16%,transparent)!important} /* تقویم: رنگ سوییت از رنگ ذخیره‌شده مستقل از نام خوانده می‌شود. */ .app-shell .day-item.period.suite-colorized{background:color-mix(in srgb,var(--suite-color,#94a0b2) 9%,#fff)!important;border-color:color-mix(in srgb,var(--suite-color,#94a0b2) 26%,#fff)!important;color:#526276!important} .app-shell .day-item.period.suite-colorized>i{background:var(--suite-color,#94a0b2)!important} .app-shell .panel-record.period.suite-colorized>i{background:var(--suite-color,#94a0b2)!important} .app-shell .panel-record.period.suite-colorized{border-right-color:var(--suite-color,#94a0b2)!important} .app-shell .cal16-entry.period.suite-colorized>i, .app-shell .cal16-timeline-row.period.suite-colorized .cal16-timeline-mark>i{background:var(--suite-color,#94a0b2)!important} .app-shell .cal16-entry.period.suite-colorized{border-color:color-mix(in srgb,var(--suite-color,#94a0b2) 24%,#e5e7eb)!important} @media(max-width:900px){ .app-shell .day-item.period.suite-colorized{background:var(--suite-color,#94a0b2)!important;border-color:var(--suite-color,#94a0b2)!important} .suite-color-dropdown{max-height:min(460px,64vh)} .smart-suite-color-picker .suite-color-trigger{height:52px} .suite-color-option{min-height:46px} } @supports not (background:color-mix(in srgb,#000 10%,#fff)){ .suite-field .suite-dot,.suite-overview-item .suite-color-dot{box-shadow:0 0 0 3px rgba(148,163,184,.13)!important} .app-shell .day-item.period.suite-colorized{background:#f7f9fc!important;border-color:#e2e8f0!important} @media(max-width:900px){.app-shell .day-item.period.suite-colorized{background:var(--suite-color,#94a0b2)!important;border-color:var(--suite-color,#94a0b2)!important}} } /* ===== settings-center-v43.css ===== */ /* Settings center v43 — settings only, flat and calm */ .settings-center-v43{max-width:1180px;margin:0 auto;padding:2px 0 36px;display:grid;gap:22px} .settings-clean-header{padding:4px 2px 14px;border-bottom:1px solid #e7ebf0} .settings-clean-header h1{margin:5px 0 7px;font-size:clamp(1.45rem,2vw,1.85rem);color:#202733} .settings-clean-header p{margin:0;max-width:760px;color:#737d8b;font-size:12.5px;line-height:1.9} .settings-center-v43 .eyebrow,.settings-detail-v42 .eyebrow{letter-spacing:0!important} .settings-clean-groups{display:grid;gap:25px} .settings-clean-group{display:grid;gap:11px} .settings-clean-group-head{padding:0 2px} .settings-clean-group-head h2{margin:0 0 4px;color:#303a48;font-size:15px;font-weight:800} .settings-clean-group-head p{margin:0;color:#89919d;font-size:11px;line-height:1.75} .settings-clean-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px} .settings-clean-item{min-height:92px;display:grid;grid-template-columns:42px minmax(0,1fr) 18px;align-items:center;gap:11px;padding:13px 14px;border:1px solid #e5e9ef;border-radius:15px;background:#fff;color:#394454;text-decoration:none;transition:border-color .15s,box-shadow .15s,transform .15s,background .15s} .settings-clean-item:hover{border-color:#d5dce5;background:#fcfdfe;box-shadow:0 7px 20px rgba(28,39,53,.055);transform:translateY(-1px)} .settings-clean-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:12px;background:#f4f6f9;color:#57677a} .settings-clean-icon .icon{width:20px;height:20px} .settings-clean-copy{min-width:0;display:grid;gap:4px} .settings-clean-copy strong{font-size:13px;color:#303b49} .settings-clean-copy small{font-size:10.5px!important;line-height:1.7;color:#858e9a} .settings-clean-arrow{font-size:20px;color:#adb4bd} /* Existing detail pages keep their compact v42 behavior. */ .settings-detail-v42 .settings-hero{align-items:center} .settings-detail-actions{position:relative;z-index:2;flex:0 0 auto} .settings-detail-v42 .settings-main-form{gap:14px} .settings-detail-v42 .settings-sticky-actions{z-index:20} .app-status-grid-v42{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:16px} .app-status-grid-v42>div{display:grid;gap:4px;padding:13px;border:1px solid #e7ebf0;border-radius:13px;background:#fafbfc} .app-status-grid-v42 span{font-size:11px;color:#7a8492} .app-status-grid-v42 b{font-size:12px;color:#344050;overflow-wrap:anywhere} @media(max-width:980px){.settings-clean-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.app-status-grid-v42{grid-template-columns:1fr}} @media(max-width:620px){ .settings-center-v43{gap:16px;padding-bottom:24px}.settings-clean-header{padding:0 2px 11px}.settings-clean-header h1{font-size:1.45rem}.settings-clean-header p{font-size:11.5px}.settings-clean-groups{gap:20px}.settings-clean-group{gap:9px}.settings-clean-group-head h2{font-size:14px}.settings-clean-group-head p{font-size:10.5px}.settings-clean-grid{grid-template-columns:1fr;gap:7px}.settings-clean-item{min-height:76px;grid-template-columns:38px minmax(0,1fr) 14px;padding:10px 11px;border-radius:13px}.settings-clean-icon{width:38px;height:38px;border-radius:11px}.settings-clean-icon .icon{width:18px;height:18px}.settings-clean-copy strong{font-size:12.5px}.settings-clean-copy small{font-size:10px!important}.settings-detail-v42 .settings-hero{display:grid;gap:12px}.settings-detail-actions{width:100%}.settings-detail-actions .button{width:100%} }