:root { --nav:#172033; --side:#e9eef5; --primary:#315efb; --bg:#f3f5f9; --muted:#667085; --line:#e0e5ec; }
* { box-sizing:border-box; }
html { font-size:15px; }
body { margin:0; min-height:100vh; display:flex; flex-direction:column; background:var(--bg); color:#202737; font-family:"Tahoma","Noto Sans Thai",sans-serif; }
.admin-navbar { height:64px; background:var(--nav); z-index:1040; }
.admin-navbar .navbar-brand { margin-left:.5rem; }
.admin-navbar .navbar-brand span { color:#84a0ff; font-size:.76em; }
.admin-navbar .navbar-text { color:#aeb8cb; }
.header-user { margin-left:auto; display:flex; align-items:center; gap:12px; color:#c8d1e1; font-size:.85rem; min-width:0; }
.header-user strong { color:white; max-width:260px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.public-nav { margin-left:auto; display:flex; align-items:center; gap:14px; }
.public-nav > a:not(.btn) { color:#d4dbea; text-decoration:none; }
.public-nav > a:not(.btn):hover { color:white; }
.language-selector { margin-left:.5rem; min-width:104px; }
.language-selector .form-select { background-color:rgba(255,255,255,.95); }
.admin-sidebar { position:fixed; top:64px; bottom:0; left:0; width:238px!important; background:var(--side); color:#263246; border-right:1px solid #d8dee8; z-index:1030; }
.admin-sidebar .offcanvas-header { background:var(--side); }
.admin-sidebar .offcanvas-body { width:100%; }
.sidebar-nav { padding:18px 12px; width:100%; }
.sidebar-nav a { display:flex; gap:12px; align-items:center; color:#344054; text-decoration:none; padding:13px 15px; border-radius:8px; margin-bottom:5px; font-weight:600; transition:color .18s ease,background-color .18s ease; }
.sidebar-icon { flex:0 0 24px; width:21px; height:21px; fill:currentColor; display:block; transition:color .18s ease,transform .18s ease; }
.sidebar-label { min-width:0; line-height:1.35; }
.sidebar-nav a:hover { color:#1d2939; background:#dce4ee; }
.sidebar-nav a:hover .sidebar-icon { transform:translateY(-1px); }
.sidebar-nav a.active,.sidebar-nav a.active:hover { color:white; background:#315efb; }
.sidebar-logout { border-top:1px solid #d8dee8; margin-top:14px; padding-top:14px; }
.sidebar-logout button { width:100%; display:flex; gap:12px; align-items:center; color:#9b2c2c; background:transparent; border:0; text-align:left; padding:13px 15px; border-radius:8px; font-weight:600; transition:color .18s ease,background-color .18s ease; }
.sidebar-logout button:hover { color:#b42318; background:#f9e5e4; }
.admin-content { flex:1 0 auto; width:calc(100% - 238px); margin-left:238px; padding:92px 28px 36px; max-width:1700px; }
.admin-footer { flex-shrink:0; margin-left:238px; padding:16px 28px; color:#667085; background:#eef2f6; border-top:1px solid #dde3eb; text-align:center; font-size:.86rem; }
.auth-content { flex:1 0 auto; min-height:calc(100vh - 50px); padding:104px 18px 40px; display:grid; place-items:center; background:radial-gradient(circle at 50% 10%,#e8edff 0,transparent 36%),var(--bg); }
.public-footer { margin-left:0; }
.auth-card { width:100%; max-width:450px; padding:30px; background:white; border:1px solid var(--line); border-radius:16px; box-shadow:0 16px 45px rgba(23,32,51,.1); }
.register-card { max-width:650px; }
.auth-card-heading { text-align:center; margin-bottom:25px; }
.auth-card-heading h1 { margin:13px 0 5px; font-size:1.55rem; font-weight:700; }
.auth-card-heading p { margin:0; color:var(--muted); }
.auth-logo { width:52px; height:52px; margin:auto; display:grid; place-items:center; border-radius:14px; color:white; background:linear-gradient(135deg,#315efb,#6d86ff); font-weight:800; box-shadow:0 8px 20px rgba(49,94,251,.25); }
.auth-switch { margin-top:22px; padding-top:18px; text-align:center; color:var(--muted); border-top:1px solid var(--line); }
.auth-switch a { font-weight:600; text-decoration:none; }
.database-settings-panel { max-width:850px; padding:24px; }
.database-security-note { display:flex; flex-direction:column; gap:3px; padding:14px 16px; margin-bottom:22px; border-radius:9px; color:#344054; background:#eef3ff; border:1px solid #dce5ff; }
.database-security-note span { color:#667085; font-size:.86rem; }
.connection-admin-actions { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-top:20px; padding-top:18px; border-top:1px solid var(--line); }
.connection-admin-actions > div:last-child { display:flex; gap:8px; flex-wrap:wrap; }
.database-required { padding:58px 24px; text-align:center; background:white; border:1px solid var(--line); border-radius:14px; }
.database-required-icon { width:54px; height:54px; margin:0 auto 16px; display:grid; place-items:center; border-radius:50%; color:#8a6100; background:#fff2cf; font-size:1.5rem; font-weight:700; }
.database-required h2 { font-size:1.25rem; margin-bottom:8px; }
.database-required p { color:var(--muted); margin-bottom:20px; }
.page-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:22px; }
.page-heading h1 { font-size:1.65rem; margin:0 0 4px; font-weight:700; }
.page-heading p { color:var(--muted); margin:0; }
.date-badge { background:white; border:1px solid var(--line); padding:9px 13px; border-radius:8px; color:var(--muted); }
.metric-card,.panel { background:white; border:1px solid var(--line); border-radius:12px; box-shadow:0 2px 8px rgba(20,30,55,.035); }
.metric-card { padding:21px; min-height:134px; position:relative; overflow:hidden; }
.metric-card:before { content:""; position:absolute; left:0; top:0; bottom:0; width:5px; background:var(--primary); }
.metric-card.success:before { background:#18a873; }.metric-card.warning:before { background:#f3a72f; }
.metric-card small,.metric-card span { display:block; color:var(--muted); }
.metric-card strong { display:block; font-size:2rem; line-height:1.25; margin:8px 0 5px; }
.panel { overflow:hidden; }
.panel-title { padding:17px 20px; border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; gap:15px; }
.panel-title h2,.receipt-summary h2 { margin:0; font-size:1.08rem; font-weight:700; }
.panel-title span { color:var(--muted); font-size:.88rem; }
.sales-chart { padding:18px 20px; }
.chart-row { display:grid; grid-template-columns:88px 1fr 90px; gap:12px; align-items:center; margin:12px 0; font-size:.84rem; }
.chart-track { height:10px; background:#edf0f6; border-radius:10px; overflow:hidden; }
.chart-track i { display:block; height:100%; background:linear-gradient(90deg,#315efb,#7893ff); border-radius:10px; min-width:3px; }
.chart-row strong { text-align:right; }
.compact-list > div { display:flex; gap:12px; align-items:center; padding:13px 20px; border-bottom:1px solid var(--line); }
.compact-list > div:last-child { border-bottom:0; }
.compact-list .rank { width:28px; height:28px; border-radius:50%; display:grid; place-items:center; background:#edf1ff; color:var(--primary); }
.compact-list span { min-width:0; flex:1; }.compact-list span strong,.compact-list span small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.compact-list span small { color:var(--muted); margin-top:2px; }.compact-list em { font-style:normal; font-weight:600; }
.filter-bar { display:flex; gap:11px; align-items:end; padding:16px 18px; border-bottom:1px solid var(--line); flex-wrap:wrap; }
.filter-bar > div { min-width:155px; }.filter-bar label { font-size:.82rem; color:var(--muted); margin-bottom:5px; display:block; }
.buddhist-date-picker { position:relative; min-width:155px; }
.buddhist-date-display { padding-right:50px; background-color:white!important; color:#202737; cursor:pointer; }
.buddhist-date-native { position:absolute; top:0; right:0; width:42px; height:100%; opacity:0; cursor:pointer; z-index:3; }
.date-icon { position:absolute; top:0; right:0; width:42px; height:100%; display:grid; place-items:center; color:#344054; background:#f8fafc; border-left:1px solid #d7dce4; border-radius:0 .375rem .375rem 0; pointer-events:none; z-index:2; transition:background-color .15s,color .15s,box-shadow .15s; }
.date-icon:before { content:""; width:21px; height:19px; border:2px solid currentColor; border-radius:3px; background:linear-gradient(currentColor,currentColor) 0 4px/100% 2px no-repeat; }
.date-icon:after { content:""; position:absolute; top:8px; width:11px; height:4px; border-left:2px solid currentColor; border-right:2px solid currentColor; }
.buddhist-date-picker:hover .date-icon { color:#315efb; background:#eef2ff; }
.buddhist-date-picker:focus-within .buddhist-date-display { border-color:#86a0ff; box-shadow:0 0 0 .2rem rgba(49,94,251,.16); }
.buddhist-date-picker:focus-within .date-icon { color:#315efb; background:#e8edff; border-color:#86a0ff; }
.report-filter > div:nth-child(1) { flex:0 1 170px; min-width:150px; }
.report-filter > div:nth-child(2),.report-filter > div:nth-child(3) { flex:0 1 145px; min-width:135px; }
.report-filter > div:nth-child(4) { flex:1 1 170px; min-width:155px; }
.report-filter > div:nth-child(5) { flex:0 1 135px; min-width:125px; }
.report-filter .filter-submit { flex:0 0 auto; min-height:38px; white-space:nowrap; }
.admin-table { vertical-align:middle; }
.admin-table > :not(caption) > * > * { padding:12px 15px; border-color:var(--line); }
.admin-table thead th { color:#596276; background:#fafbfc; white-space:nowrap; font-size:.82rem; text-transform:none; }
.admin-table tbody td { font-size:.9rem; }
.admin-table tfoot th { background:#f8f9fc; }
.status-badge { display:inline-block; border-radius:100px; padding:4px 9px; font-size:.76rem; font-weight:600; background:#eef1f5; color:#596276; white-space:nowrap; }
.status-badge.active { background:#e5f8f1; color:#087b53; }.status-badge.inactive { background:#fdeceb; color:#b42318; }.status-badge.pending { background:#fff3d8; color:#946200; }
.role-badge { display:inline-block; min-width:54px; padding:4px 10px; border-radius:100px; text-align:center; font-size:.76rem; font-weight:700; }
.role-badge.admin { color:#2849c7; background:#e8edff; }.role-badge.user { color:#475467; background:#eef1f5; }
.actions { white-space:nowrap; text-align:right; }
.empty-state { padding:45px 20px; color:var(--muted); text-align:center; }
.panel-footer { padding:13px 18px; display:flex; align-items:center; justify-content:space-between; color:var(--muted); }
.panel-footer nav { display:flex; gap:10px; align-items:center; }
.form-panel { padding:24px; max-width:980px; }
.form-actions { border-top:1px solid var(--line); margin-top:24px; padding-top:20px; display:flex; gap:10px; }
.receipt-summary { padding:20px; }
.receipt-summary h2 { margin-bottom:14px; }
.receipt-summary dl { margin:0; }.receipt-summary dl div { display:flex; justify-content:space-between; gap:15px; padding:10px 0; border-bottom:1px dashed var(--line); }
.receipt-summary dt { color:var(--muted); font-weight:400; }.receipt-summary dd { margin:0; text-align:right; font-weight:600; }
.receipt-summary .grand { font-size:1.15rem; border-bottom:0; padding-top:18px; }.receipt-summary .grand dt,.receipt-summary .grand dd { color:#202737; font-weight:700; }
.text-break { word-break:break-all; }
.status-badge.approved { background:#e5f8f1; color:#087b53; }
.status-badge.rejected { background:#fdeceb; color:#b42318; }
.license-details { margin:0; }
.license-details > div { padding:13px 0; border-top:1px solid var(--line); }
.license-details dt { color:var(--muted); font-size:.82rem; margin-bottom:5px; }
.license-details dd { margin:0; }

/* Public product and license page */
.sale-page { width:100%; margin:-40px -18px; color:#182033; }
.sale-hero { min-height:650px; padding:100px max(6vw,30px) 70px; display:grid; grid-template-columns:minmax(0,1fr) minmax(360px,560px); align-items:center; gap:7vw; color:white; background:radial-gradient(circle at 85% 15%,rgba(118,144,255,.38),transparent 28%),linear-gradient(135deg,#121a2d,#20376b 62%,#315efb); }
.sale-kicker { display:inline-block; margin-bottom:18px; color:#aebfff; font-size:.78rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.sale-kicker.dark { color:#315efb; }
.sale-hero h1 { font-size:clamp(2.4rem,4.5vw,4.7rem); line-height:1.12; letter-spacing:-.04em; font-weight:800; margin:0 0 24px; }
.sale-hero p { max-width:650px; color:#d6deee; font-size:1.1rem; line-height:1.8; }
.sale-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:30px; }
.sale-trust { display:flex; flex-wrap:wrap; gap:22px; margin-top:30px; color:#c4d0e6; font-size:.88rem; }
.pos-preview { border:1px solid rgba(255,255,255,.2); border-radius:18px; overflow:hidden; background:#f7f9fc; box-shadow:0 35px 80px rgba(3,10,28,.42); transform:perspective(1000px) rotateY(-4deg) rotateX(2deg); }
.preview-top { height:45px; padding:0 14px; display:flex; align-items:center; gap:7px; color:#5f6b82; background:white; border-bottom:1px solid #e7ebf1; }
.preview-top i { width:8px; height:8px; border-radius:50%; background:#d8deea; }.preview-top strong { margin-left:auto; font-size:.75rem; }
.preview-body { display:grid; grid-template-columns:65px 1fr; min-height:330px; }.preview-menu { padding:25px 16px; background:#18243a; }.preview-menu b { display:block; height:9px; margin-bottom:26px; border-radius:5px; background:#53627c; }.preview-menu b:first-child { background:#7893ff; }
.preview-content { padding:35px; }.preview-content small { color:#78849a; }.preview-content > strong { display:block; margin:6px 0 25px; color:#1c2a45; font-size:2.2rem; }
.preview-chart { height:130px; display:flex; align-items:end; gap:8px; padding:10px 5px 0; border-bottom:1px solid #dbe1eb; }.preview-chart i { flex:1; background:linear-gradient(#7893ff,#315efb); border-radius:4px 4px 0 0; }.preview-chart i:nth-child(1){height:35%}.preview-chart i:nth-child(2){height:62%}.preview-chart i:nth-child(3){height:48%}.preview-chart i:nth-child(4){height:83%}.preview-chart i:nth-child(5){height:68%}.preview-chart i:nth-child(6){height:100%}
.preview-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:20px; }.preview-cards b { height:35px; background:#e7ebf3; border-radius:6px; }
.sale-section { max-width:1250px; margin:auto; padding:100px 30px; }.sale-heading { max-width:680px; margin:0 auto 45px; text-align:center; }.sale-heading > span { color:#315efb; font-size:.8rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; }.sale-heading h2,.usage-section h2,.request-copy h2 { margin:10px 0 14px; font-size:clamp(1.8rem,3vw,2.8rem); font-weight:800; letter-spacing:-.025em; }.sale-heading p { color:var(--muted); }
.feature-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }.feature-grid article { padding:28px 24px; background:white; border:1px solid var(--line); border-radius:14px; }.feature-grid i { width:42px; height:42px; display:grid; place-items:center; color:#315efb; background:#edf1ff; border-radius:10px; font-style:normal; font-weight:800; }.feature-grid h3 { margin:22px 0 10px; font-size:1.08rem; font-weight:700; }.feature-grid p { margin:0; color:var(--muted); line-height:1.7; font-size:.9rem; }
.usage-section { padding:80px max(8vw,30px); display:grid; grid-template-columns:1fr 1.2fr; gap:8vw; align-items:center; background:#fff; }.usage-section ol { list-style:none; margin:0; padding:0; }.usage-section li { display:flex; gap:18px; align-items:center; padding:20px 0; border-bottom:1px solid var(--line); }.usage-section li > b { width:45px; height:45px; flex:0 0 45px; display:grid; place-items:center; color:white; background:#315efb; border-radius:50%; }.usage-section li strong,.usage-section li small { display:block; }.usage-section li small { margin-top:5px; color:var(--muted); }
.pricing-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; align-items:stretch; }.pricing-grid article { position:relative; padding:32px; display:flex; flex-direction:column; background:white; border:1px solid var(--line); border-radius:16px; }.pricing-grid article.featured { border:2px solid #315efb; box-shadow:0 16px 45px rgba(49,94,251,.12); }.pricing-grid article.featured > span { position:absolute; right:18px; top:18px; padding:4px 10px; border-radius:20px; color:#315efb; background:#edf1ff; font-size:.75rem; font-weight:700; }.pricing-grid h3 { font-weight:800; }.pricing-grid p { min-height:48px; color:var(--muted); }.pricing-grid > article > strong { margin:12px 0 20px; font-size:1.45rem; }.pricing-grid ul { flex:1; padding-left:20px; color:#49536a; line-height:2; }.pricing-grid .btn { margin-top:15px; }
.request-section { padding:90px max(8vw,30px); display:grid; grid-template-columns:.8fr 1.2fr; gap:8vw; color:white; background:#172033; }.request-copy p { color:#c5cede; line-height:1.75; }.request-note { margin-top:30px; padding:18px; color:#dbe3f1; background:#222e45; border:1px solid #34425b; border-radius:10px; font-size:.88rem; line-height:1.7; }.request-form { padding:32px; color:#202737; background:white; border-radius:16px; box-shadow:0 22px 60px rgba(0,0,0,.2); }.request-form .form-control { min-height:46px; }

@media (max-width:991.98px) {
  .sale-page { margin:-22px -18px; }.sale-hero { grid-template-columns:1fr; padding-top:80px; }.pos-preview { max-width:620px; transform:none; }.feature-grid { grid-template-columns:repeat(2,1fr); }.usage-section,.request-section { grid-template-columns:1fr; }.pricing-grid { grid-template-columns:1fr; max-width:600px; margin:auto; }
}

/* 2026 Sale landing overrides */
.sale-page { --sale-orange:#ff5a13; --sale-ink:#151b26; color:var(--sale-ink); background:#fbfaf8; overflow:hidden; }
.sale-hero { min-height:690px; grid-template-columns:minmax(0,1fr) minmax(360px,590px); color:var(--sale-ink); background:radial-gradient(circle at 78% 18%,#ffe0c7 0,transparent 25%),radial-gradient(circle at 10% 80%,#fff0df 0,transparent 30%),#fbfaf8; }
.sale-kicker,.sale-heading > span { color:var(--sale-orange); font-weight:800; }
.sale-hero h1 { font-size:clamp(3rem,6vw,6rem); line-height:.98; letter-spacing:-.065em; font-weight:900; }.sale-hero h1 em { color:var(--sale-orange); font-style:normal; }
.sale-hero p { color:#5f6673; }.sale-trust { color:#69707d; }
.btn-sale-primary { color:white; background:var(--sale-orange); border-color:var(--sale-orange); box-shadow:0 12px 30px rgba(255,90,19,.22); }.btn-sale-primary:hover { color:white; background:#e94a05; border-color:#e94a05; transform:translateY(-1px); }
.btn-sale-ghost { color:var(--sale-ink); background:white; border-color:#dedbd6; }.btn-sale-ghost:hover { color:var(--sale-orange); border-color:var(--sale-orange); }
.hero-product { position:relative; min-height:520px; display:grid; place-items:center; }.hero-product > img { position:relative; z-index:2; width:min(100%,560px); aspect-ratio:3/2; object-fit:cover; border-radius:38px; box-shadow:0 35px 80px rgba(68,35,15,.23); transform:rotate(2deg); }.hero-glow { position:absolute; width:430px; height:430px; border-radius:50%; background:linear-gradient(135deg,#ffb267,#ff5a13); opacity:.22; }
.hero-stat { position:absolute; z-index:3; padding:16px 18px; background:rgba(255,255,255,.93); border:1px solid white; border-radius:15px; box-shadow:0 14px 38px rgba(31,24,19,.16); backdrop-filter:blur(14px); }.hero-stat small,.hero-stat strong { display:block; }.hero-stat-top { top:55px; right:-18px; min-width:170px; }.hero-stat-top small,.hero-stat-bottom small { color:#737986; }.hero-stat-top strong { margin:3px 0; font-size:1.35rem; }.hero-stat-top span { color:#0c9c6a; font-size:.78rem; font-weight:700; }.hero-stat-bottom { bottom:40px; left:-20px; display:flex; align-items:center; gap:12px; }.hero-stat-bottom i { width:12px; height:12px; border-radius:50%; background:#20bd7a; box-shadow:0 0 0 6px #dff8ed; }
.feature-grid i { color:var(--sale-orange); background:#fff0e8; font-size:1.15rem; }
.request-brand { width:92px; height:92px; display:block; object-fit:cover; margin-bottom:25px; border-radius:22px; }
.product-tour { padding:105px max(6vw,30px); background:#151b26; color:white; }.product-tour .sale-heading p { color:#aeb5c1; }.tour-grid { max-width:1250px; margin:auto; display:grid; grid-template-columns:repeat(2,1fr); gap:22px; }.tour-card { min-height:500px; padding:35px; display:flex; flex-direction:column; overflow:hidden; border:1px solid #303744; border-radius:22px; background:#1d2430; }.tour-copy > span { color:#ff8b59; font-size:.75rem; font-weight:800; letter-spacing:.1em; }.tour-copy h3 { margin:10px 0; font-size:1.45rem; font-weight:800; }.tour-copy p { color:#aeb5c1; line-height:1.7; }.pos-ui,.stock-ui,.receipt-ui,.report-ui { margin-top:auto; color:#202737; background:#f8f9fb; border-radius:15px; box-shadow:0 20px 45px rgba(0,0,0,.22); }
.pos-ui { padding:18px; }.ui-search { padding:11px 13px; color:#7b8290; background:white; border:1px solid #e1e5eb; border-radius:8px; font-size:.78rem; }.product-dots { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin:13px 0; }.product-dots b { min-height:72px; padding:12px 8px 8px; display:flex; flex-direction:column; justify-content:flex-end; border-radius:9px; background:#ffeadf; font-size:.76rem; }.product-dots b:nth-child(2){background:#fff1c5}.product-dots b:nth-child(3){background:#dfecff}.product-dots b:nth-child(4){background:#dff7e9}.product-dots small { color:#69707d; }.ui-total { padding:12px 14px; display:flex; justify-content:space-between; align-items:center; color:white; background:var(--sale-orange); border-radius:9px; }
.stock-ui { padding:8px 18px; }.stock-ui > div { display:flex; align-items:center; gap:12px; padding:13px 0; border-bottom:1px solid #e4e7ec; }.stock-ui > div:last-child { border:0; }.stock-pic { width:40px; height:40px; flex:0 0 40px; border-radius:9px; background:#ffd8c4; }.stock-pic.blue{background:#d6e6ff}.stock-pic.green{background:#d9f3e5}.stock-ui span { flex:1; }.stock-ui b,.stock-ui small { display:block; }.stock-ui small { color:#8a909c; }.stock-ui > div > strong { font-size:.85rem; }
.receipt-ui { padding:18px; }.receipt-ui > div,.receipt-ui footer,.receipt-ui li { display:flex; justify-content:space-between; gap:15px; }.receipt-ui > div b { padding:3px 8px; color:#087b53; background:#dff7e9; border-radius:20px; font-size:.7rem; }.receipt-ui ul { margin:16px 0; padding:14px 0; list-style:none; border-top:1px dashed #ccd1da; border-bottom:1px dashed #ccd1da; }.receipt-ui li { padding:5px 0; }.receipt-ui footer strong { font-size:1.25rem; color:var(--sale-orange); }
.report-ui { padding:22px; }.report-number { position:relative; }.report-number small,.report-number strong { display:block; }.report-number strong { margin-top:5px; font-size:1.8rem; }.report-number span { position:absolute; top:10px; right:0; color:#087b53; font-weight:700; font-size:.8rem; }.report-bars { height:145px; display:flex; align-items:end; gap:9px; margin-top:15px; border-bottom:1px solid #d8dce4; }.report-bars i { flex:1; height:40%; border-radius:5px 5px 0 0; background:#ffb18f; }.report-bars i:nth-child(2){height:57%}.report-bars i:nth-child(3){height:48%}.report-bars i:nth-child(4){height:73%}.report-bars i:nth-child(5){height:64%}.report-bars i:nth-child(6){height:88%}.report-bars i:nth-child(7){height:100%;background:var(--sale-orange)}

@media (max-width:991.98px) { .hero-product { width:min(100%,650px); margin:auto; }.tour-grid { grid-template-columns:1fr; } }
@media (max-width:767.98px) { .hero-product { min-height:360px; }.hero-product > img { border-radius:24px; }.hero-stat-top { top:20px; right:-5px; }.hero-stat-bottom { bottom:15px; left:-4px; }.product-tour { padding:65px 18px; }.tour-card { min-height:470px; padding:25px 18px; }.product-dots { grid-template-columns:repeat(2,1fr); } }

.sale-hero { min-height:auto; padding:78px max(6vw,30px) 68px; grid-template-columns:minmax(0,1.22fr) minmax(300px,1fr); gap:6vw; background:#fbfaf8; }
.hero-product { min-height:0; display:flex; align-items:center; justify-content:center; }
.hero-product > .hero-screenshot { display:block; width:auto; max-width:100%; height:auto; max-height:500px; aspect-ratio:auto; object-fit:contain; object-position:center; border:1px solid #dedbd6; border-radius:10px; background:#fff; box-shadow:none; transform:none; }
@media (max-width:767.98px) {
  .sale-hero { padding:60px 20px 50px; gap:38px; }
  .hero-product { width:100%; }
  .hero-product > .hero-screenshot { width:auto; max-width:100%; max-height:480px; object-fit:contain; border-radius:8px; }
}

.activation-link-box { margin-top:22px; padding:15px; border:1px solid #dce5ff; border-radius:9px; background:#f5f7ff; }
.license-activation-card { width:100%; max-width:680px; padding:34px; background:white; border:1px solid var(--line); border-radius:16px; box-shadow:0 16px 45px rgba(23,32,51,.1); }
.activation-heading { text-align:center; margin-bottom:28px; }.activation-heading > span { color:#315efb; font-size:.75rem; font-weight:800; letter-spacing:.12em; }.activation-heading h1 { margin:9px 0; font-size:1.8rem; font-weight:800; }.activation-heading p { margin:0; color:var(--muted); }
.license-public-details { margin:0 0 22px; }.license-public-details > div { display:grid; grid-template-columns:120px 1fr; gap:16px; padding:12px 0; border-bottom:1px solid var(--line); }.license-public-details dt { color:var(--muted); font-weight:400; }.license-public-details dd { margin:0; font-weight:600; }
.license-key-public { padding:20px; border-radius:12px; background:#f5f7ff; border:1px solid #dce5ff; }.license-key-public label { margin-bottom:8px; font-weight:700; }.license-instructions { margin-top:28px; }.license-instructions h2 { font-size:1.05rem; font-weight:700; }.license-instructions ol { margin-bottom:0; padding-left:22px; color:#4d576b; line-height:1.9; }.license-security-note { margin:22px 0 0; padding-top:18px; color:var(--muted); border-top:1px solid var(--line); font-size:.82rem; text-align:center; }
@media (max-width:575.98px) { .license-activation-card { padding:24px 18px; border-radius:12px; }.license-public-details > div { grid-template-columns:1fr; gap:4px; } }

@media (max-width:991.98px) {
  .admin-sidebar { top:0; }
  .admin-content { width:100%; margin-left:0; padding:86px 16px 28px; }
  .admin-footer { margin-left:0; padding:14px 16px; }
}

.product-image-editor {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
}

.product-image-preview {
  width: 180px;
  aspect-ratio: 1;
  flex: 0 0 180px;
  overflow: hidden;
  border: 1px solid #d9e0ea;
  border-radius: .75rem;
  background: #f4f6fa;
}

.product-image-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.product-image-placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: .35rem;
  color: #718096;
}

.product-image-placeholder span { font-size: 2.25rem; }

.product-image-controls {
  max-width: 520px;
  display: flex;
  flex-direction: column;
  gap: .6rem;
}

.product-image-controls .btn { align-self: flex-start; }

@media (max-width: 575.98px) {
  .product-image-editor { flex-direction: column; }
}
@media (max-width:767.98px) {
  html { font-size:14px; }
  .page-heading { align-items:flex-start; }.page-heading h1 { font-size:1.4rem; }
  .date-badge { display:none; }
  .filter-bar { align-items:stretch; }.filter-bar > div,.filter-bar .btn { width:100%; }
  .mobile-cards thead { display:none; }
  .mobile-cards,.mobile-cards tbody,.mobile-cards tr,.mobile-cards td { display:block; width:100%; }
  .mobile-cards tr { padding:10px 12px; border-bottom:8px solid var(--bg); }
  .mobile-cards tbody td { border:0; padding:5px 4px; display:flex; justify-content:space-between; gap:15px; text-align:right!important; }
  .mobile-cards tbody td:before { content:attr(data-label); color:var(--muted); text-align:left; flex:0 0 82px; }
  .mobile-cards td.actions { display:block; padding-top:10px; }
  .mobile-cards td.actions:before { display:none; }
  .mobile-cards tfoot { display:table; width:100%; }
  .panel-footer { align-items:flex-start; gap:10px; flex-direction:column; }.panel-footer nav { width:100%; justify-content:space-between; }
  .chart-row { grid-template-columns:74px 1fr 70px; gap:8px; }
  .header-user strong { max-width:150px; }
  .auth-content { padding:88px 12px 24px; align-items:start; }
  .auth-card { padding:23px 18px; border-radius:12px; }
  .database-settings-panel { padding:18px; }
  .connection-admin-actions { align-items:flex-start; flex-direction:column; }
  .sale-page { margin:-24px -12px; }.sale-hero { min-height:auto; padding:70px 20px 55px; }.sale-hero h1 br { display:none; }.pos-preview { display:none; }.sale-section,.usage-section,.request-section { padding:65px 18px; }.feature-grid { grid-template-columns:1fr; }.sale-trust { gap:10px 18px; }.request-form { padding:22px 18px; }.public-nav > a:first-child { display:none; }
}
