:root {
    --lamaah-deep: #4C14B5;
    --lamaah-royal: #6B2AD9;
    --lamaah-lavender: #A56CFF;
    --lamaah-light: #D3B4FF;
    --lamaah-white: #FFFFFF;
    --lamaah-950: #2D0A68;
    --lamaah-900: #3C0E8C;
    --lamaah-800: #4C14B5;
    --lamaah-700: #6B2AD9;
    --lamaah-500: #A56CFF;
    --lamaah-300: #D3B4FF;
    --lamaah-100: #EFE5FF;
    --lamaah-050: #FAF7FF;
    --ink: #24143F;
    --muted: #746887;
    --line: #E8DFF5;
    --surface: #FFFFFF;
    --danger: #B42318;
    --success: #1B7F5A;
    --font-ui-ar: "Tajawal", "Segoe UI", Tahoma, Arial, sans-serif;
    --font-ui-latin: "Inter", "Segoe UI", Arial, sans-serif;
}

* { box-sizing: border-box; }
html, body { min-height: 100%; }
body {
    margin: 0;
    font-family: var(--font-ui-ar);
    font-weight: 400;
    letter-spacing: -0.01em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    background:
        radial-gradient(circle at 88% 4%, rgba(211,180,255,.22), transparent 22rem),
        #F9F7FC;
    color: var(--ink);
}
button, input, select, textarea { font: inherit; }
button, .main-nav a { font-weight: 600; }
h1, h2, h3, h4, h5, h6, strong, b { font-weight: 700; }
[dir="ltr"], [dir="ltr"] input, [dir="ltr"] select, [dir="ltr"] textarea, bdi[dir="ltr"] {
    font-family: var(--font-ui-latin);
    letter-spacing: 0;
}
input[type="number"], input[type="date"], input[type="time"], input[type="email"], input[type="tel"], code, pre {
    font-variant-numeric: tabular-nums;
}
button { cursor: pointer; }

.boot-screen {
    min-height: 100vh;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 16px;
    color: var(--lamaah-deep);
    background: radial-gradient(circle at 50% 35%, #F1E7FF 0, #FBF9FF 38%, #FFFFFF 72%);
}
.boot-screen img { width: 112px; height: 112px; object-fit: contain; }
.boot-screen span { font-weight: 700; }

.shell { display: flex; min-height: 100vh; }
.sidebar {
    width: 278px;
    background: linear-gradient(180deg, #351078 0%, var(--lamaah-deep) 50%, #2B0865 100%);
    color: #fff;
    padding: 18px 15px;
    display: flex;
    flex-direction: column;
    box-shadow: -10px 0 40px rgba(76,20,181,.16);
    position: relative;
    overflow: hidden;
}
.sidebar::before,
.sidebar::after {
    content: "";
    position: absolute;
    border-radius: 999px;
    pointer-events: none;
}
.sidebar::before { width: 220px; height: 220px; top: -115px; left: -100px; background: rgba(165,108,255,.16); }
.sidebar::after { width: 170px; height: 170px; bottom: 80px; right: -110px; background: rgba(211,180,255,.10); }
.brand {
    position: relative;
    z-index: 1;
    padding: 12px;
    border: 1px solid rgba(255,255,255,.28);
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 15px 34px rgba(26,5,68,.18);
    margin-bottom: 20px;
}
.brand-logo { width: 100%; height: 82px; object-fit: contain; object-position: center; }
.main-nav { position: relative; z-index: 1; display: grid; gap: 7px; }
.main-nav a {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #F2EAFF;
    text-decoration: none;
    padding: 12px 13px;
    border: 1px solid transparent;
    border-radius: 13px;
    transition: .18s ease;
}
.main-nav a.active,
.main-nav a:hover {
    background: linear-gradient(135deg, rgba(165,108,255,.28), rgba(211,180,255,.12));
    border-color: rgba(211,180,255,.28);
    color: #fff;
    transform: translateX(-2px);
}
.nav-icon { width: 25px; display: inline-grid; place-items: center; color: var(--lamaah-light); font-size: 18px; }
.sidebar-footer { position: relative; z-index: 1; margin-top: auto; padding-top: 18px; }
.brand-mini { display: flex; align-items: center; gap: 9px; border-top: 1px solid rgba(255,255,255,.14); padding-top: 16px; margin-bottom: 12px; }
.brand-mini img { width: 44px; height: 44px; object-fit: contain; filter: drop-shadow(0 6px 10px rgba(0,0,0,.15)); }
.brand-mini strong, .brand-mini small { display: block; }
.brand-mini small { margin-top: 3px; color: #DCCBFF; font-size: 11px; }
.logout { width: 100%; border: 1px solid rgba(255,255,255,.28); background: rgba(255,255,255,.08); color: #fff; border-radius: 12px; padding: 11px; transition: .18s ease; }
.logout:hover { background: rgba(255,255,255,.15); border-color: rgba(255,255,255,.42); }

.content { flex: 1; min-width: 0; padding: 30px; overflow: auto; }
h1 { margin: 0 0 7px; color: var(--lamaah-950); }
.muted { color: var(--muted); }
.page-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    background: linear-gradient(135deg,#fff 0%,#FCFAFF 58%,#F1E7FF 100%);
    border: 1px solid var(--line);
    border-radius: 24px;
    padding: 22px 24px;
    box-shadow: 0 12px 38px rgba(76,20,181,.07);
    position: relative;
    overflow: hidden;
}
.page-head::after {
    content: "";
    position: absolute;
    width: 180px;
    height: 180px;
    inset-inline-end: -95px;
    bottom: -110px;
    border-radius: 50%;
    background: rgba(165,108,255,.14);
}
.page-head > * { position: relative; z-index: 1; }
.page-kicker { display: block; color: var(--lamaah-royal); font-size: 12px; font-weight: 700; letter-spacing: .08em; margin-bottom: 6px; }
.page-mark { width: 92px; height: 92px; object-fit: contain; filter: drop-shadow(0 8px 16px rgba(76,20,181,.12)); }

.stats { display: grid; grid-template-columns: repeat(4,minmax(160px,1fr)); gap: 14px; margin-top: 22px; }
.stats > div, .card, .empty-card {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 18px;
    box-shadow: 0 8px 28px rgba(76,20,181,.045);
}
.stats > div { position: relative; overflow: hidden; min-height: 105px; }
.stats > div::after {
    content: "";
    position: absolute;
    inset-inline-end: -18px;
    top: -18px;
    width: 78px;
    height: 78px;
    border-radius: 50%;
    background: linear-gradient(135deg,var(--lamaah-100),var(--lamaah-light));
    opacity: .72;
}
.stats span, .stats strong { display: block; position: relative; z-index: 1; }
.stats span { color: var(--muted); }
.stats strong { font-size: 28px; margin-top: 9px; color: var(--lamaah-deep); }
.loading { margin-top: 20px; padding: 16px; border: 1px solid var(--line); background: #fff; border-radius: 14px; color: var(--lamaah-royal); }

.grid { width: 100%; border-collapse: separate; border-spacing: 0; background: #fff; border: 1px solid var(--line); border-radius: 16px; overflow: hidden; margin-top: 18px; box-shadow: 0 8px 28px rgba(76,20,181,.04); }
.grid th, .grid td { padding: 13px 14px; border-bottom: 1px solid #F0EAF7; text-align: right; }
.grid th { background: var(--lamaah-050); color: var(--lamaah-950); }
.grid tbody tr:hover { background: #FCFAFF; }
.status { display: inline-block; background: var(--lamaah-100); color: var(--lamaah-deep); padding: 5px 10px; border-radius: 999px; font-weight: 700; }
.cards { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; margin-top: 18px; }
.card > * { display: block; margin-bottom: 7px; }
.card span, .card small { color: var(--muted); }
.empty-card { margin-top: 18px; max-width: 760px; }

.login-page {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 20px;
    background:
        radial-gradient(circle at 76% 16%, rgba(165,108,255,.40) 0, rgba(211,180,255,.26) 21%, transparent 43%),
        radial-gradient(circle at 14% 90%, rgba(107,42,217,.15) 0, transparent 35%),
        linear-gradient(145deg,#FFFFFF 0%,#FAF6FF 48%,#F0E5FF 100%);
}
.login-card {
    width: min(94vw,455px);
    background: rgba(255,255,255,.95);
    padding: 30px 34px 28px;
    border: 1px solid #E5D8F7;
    border-radius: 28px;
    box-shadow: 0 30px 90px rgba(76,20,181,.20);
    backdrop-filter: blur(10px);
}
.login-brand { display: grid; place-items: center; margin-bottom: 8px; padding: 8px 14px; }
.login-brand img { width: min(100%,330px); max-height: 165px; object-fit: contain; }
.login-card h1 { margin-top: 4px; text-align: center; color: var(--lamaah-950); }
.login-card p { color: var(--muted); text-align: center; margin-bottom: 24px; }
.login-card label { display: block; margin-top: 12px; font-size: 13px; font-weight: 700; color: #43286C; }
.login-card input, .login-card button { width: 100%; padding: 13px 14px; margin-top: 7px; border-radius: 12px; }
.login-card input { border: 1px solid #DCCDF1; outline: none; background: #FDFBFF; color: var(--ink); }
.login-card input:focus { border-color: var(--lamaah-lavender); box-shadow: 0 0 0 3px rgba(165,108,255,.18); background: #fff; }
.login-card button { margin-top: 18px; border: 0; background: linear-gradient(135deg,var(--lamaah-deep),var(--lamaah-royal) 56%,var(--lamaah-lavender)); color: #fff; font-weight: bold; box-shadow: 0 12px 25px rgba(107,42,217,.26); transition: .18s ease; }
.login-card button:hover:not(:disabled) { transform: translateY(-1px); box-shadow: 0 15px 30px rgba(107,42,217,.32); }
.login-card button:disabled { opacity: .65; cursor: wait; }
.error { margin-top: 14px; padding: 10px; border-radius: 10px; background: #FFF1F1; color: var(--danger); }
.login-note { margin-top: 20px; text-align: center; font-size: 11px; color: #8D7EA4; letter-spacing: .03em; }

@media (max-width: 950px) {
    .sidebar { width: 224px; }
    .stats { grid-template-columns: repeat(2,1fr); }
    .cards { grid-template-columns: 1fr 1fr; }
    .brand-logo { height: 68px; }
}

@media (max-width: 680px) {
    .shell { display: block; }
    .sidebar { width: 100%; min-height: auto; padding-bottom: 14px; }
    .brand { max-width: 260px; margin-inline: auto; padding: 9px; }
    .main-nav { grid-template-columns: 1fr 1fr; }
    .sidebar-footer { margin-top: 14px; }
    .brand-mini { display: none; }
    .content { padding: 18px; }
    .stats, .cards { grid-template-columns: 1fr; }
    .grid { display: block; overflow-x: auto; }
    .page-head { align-items: flex-start; }
    .page-mark { width: 68px; height: 68px; }
    .login-card { padding: 25px 22px; }
}

.primary-action,.secondary-action,.table-action{border:0;border-radius:12px;padding:10px 16px;font-weight:700}.primary-action{background:linear-gradient(135deg,var(--lamaah-deep),var(--lamaah-royal));color:#fff;box-shadow:0 8px 18px rgba(76,20,181,.18)}.secondary-action,.table-action{background:var(--lamaah-100);color:var(--lamaah-deep)}
.editor-card{margin-top:18px;background:#fff;border:1px solid var(--line);border-radius:20px;padding:20px;box-shadow:0 8px 28px rgba(76,20,181,.05)}.editor-card h3{margin:0 0 16px;color:var(--lamaah-950)}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.form-grid label{display:grid;gap:7px;font-size:13px;font-weight:700;color:#43286C}.form-grid input,.form-grid select,.form-grid textarea{width:100%;padding:11px 12px;border:1px solid #DCCDF1;border-radius:11px;background:#FDFBFF;outline:none}.form-grid input:focus{border-color:var(--lamaah-lavender);box-shadow:0 0 0 3px rgba(165,108,255,.13)}.form-grid .span-2{grid-column:span 2}.form-grid .check-line{display:flex;align-items:center;gap:8px;align-self:end;min-height:43px}.form-grid .check-line input{width:auto}.form-actions{display:flex;gap:10px;margin-top:18px}.notice{margin-top:16px;padding:12px 14px;background:#F3ECFF;border:1px solid #DCC7FF;color:#4C14B5;border-radius:12px}.table-action{padding:7px 11px}
@media(max-width:680px){.form-grid{grid-template-columns:1fr}.form-grid .span-2{grid-column:auto}.form-actions{flex-wrap:wrap}}

/* Platform / create laundry */
.nav-section-label {
    padding: 7px 13px 5px;
    margin-top: 2px;
    color: #CDB9F5;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .08em;
}
.platform-head .head-actions { display: flex; align-items: center; gap: 10px; }
.platform-summary {
    display: grid;
    grid-template-columns: repeat(4,minmax(150px,1fr));
    gap: 14px;
    margin-top: 18px;
}
.platform-summary > div {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 17px;
    padding: 16px 18px;
    box-shadow: 0 8px 28px rgba(76,20,181,.045);
}
.platform-summary span,.platform-summary strong { display:block; }
.platform-summary span { color:var(--muted); font-size:12px; }
.platform-summary strong { color:var(--lamaah-deep); font-size:25px; margin-top:7px; }
.platform-stats { grid-template-columns: repeat(3,minmax(160px,1fr)); }

.account-create-panel {
    margin-top: 18px;
    background: #fff;
    border: 1px solid #DCCDF1;
    border-radius: 24px;
    box-shadow: 0 22px 58px rgba(76,20,181,.10);
    overflow: hidden;
}
.account-create-title {
    display:flex;
    justify-content:space-between;
    gap:20px;
    align-items:flex-start;
    padding:22px 24px;
    background:linear-gradient(135deg,#FFFFFF,#FAF6FF 56%,#F0E5FF);
    border-bottom:1px solid var(--line);
}
.account-create-title h2 { margin:5px 0 6px; color:var(--lamaah-950); }
.account-create-title p { margin:0; color:var(--muted); }
.section-step { color:var(--lamaah-royal); font-size:11px; font-weight:700; letter-spacing:.08em; }
.icon-close { border:0; background:#fff; color:var(--lamaah-deep); width:36px; height:36px; border-radius:12px; font-size:24px; line-height:1; box-shadow:0 4px 14px rgba(76,20,181,.10); }
.setup-sections { padding: 4px 24px 2px; }
.setup-section { padding:22px 0; border-bottom:1px solid #F0EAF7; }
.setup-section:last-child { border-bottom:0; }
.setup-section-head { display:flex; align-items:center; gap:11px; margin-bottom:16px; }
.setup-section-head > span { width:34px; height:34px; border-radius:11px; display:grid; place-items:center; color:#fff; font-weight:700; background:linear-gradient(135deg,var(--lamaah-deep),var(--lamaah-lavender)); box-shadow:0 7px 16px rgba(76,20,181,.18); }
.setup-section-head strong,.setup-section-head small { display:block; }
.setup-section-head strong { color:var(--lamaah-950); }
.setup-section-head small { margin-top:3px; color:var(--muted); font-weight:400; }
.setup-section .form-grid label > small { color:var(--muted); font-weight:400; font-size:11px; }
.input-prefix { display:flex; direction:ltr; border:1px solid #DCCDF1; border-radius:11px; background:#FDFBFF; overflow:hidden; }
.input-prefix > span { display:grid; place-items:center; width:38px; color:var(--lamaah-royal); background:#F5EEFF; border-right:1px solid #E4D8F4; }
.input-prefix input { border:0 !important; border-radius:0 !important; box-shadow:none !important; }
.check-card {
    display:flex !important;
    flex-direction:row !important;
    gap:10px !important;
    align-items:flex-start;
    padding:12px 13px;
    border:1px solid #E4D9F3;
    border-radius:13px;
    background:#FCFAFF;
    min-height:68px;
}
.check-card input { width:auto !important; margin-top:4px; accent-color:var(--lamaah-deep); }
.check-card span,.check-card strong,.check-card small { display:block; }
.check-card strong { color:#43286C; }
.check-card small { margin-top:4px; color:var(--muted); font-weight:400; }
.compact-section { padding-bottom:12px; }
.payment-options { display:flex; flex-wrap:wrap; gap:10px; }
.payment-options label { min-width:130px; padding:11px 14px; border:1px solid #E2D6F2; border-radius:12px; background:#FCFAFF; font-weight:700; color:#43286C; }
.payment-options input { margin-inline-end:7px; accent-color:var(--lamaah-deep); }
.create-footer { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:18px 24px 22px; background:#FCFAFF; border-top:1px solid var(--line); }
.creation-summary { display:flex; align-items:center; flex-wrap:wrap; gap:7px; }
.creation-summary > strong { color:var(--lamaah-950); margin-inline-end:2px; }
.creation-summary > span { background:var(--lamaah-100); color:var(--lamaah-deep); border-radius:999px; padding:5px 9px; font-size:11px; font-weight:700; }
.create-footer .form-actions { margin-top:0; white-space:nowrap; }
.notice-error { background:#FFF2F1; border-color:#F2C5C0; color:#9F251D; }

.accounts-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-top:18px; }
.account-card { background:#fff; border:1px solid var(--line); border-radius:20px; padding:18px; box-shadow:0 10px 30px rgba(76,20,181,.055); transition:.18s ease; }
.account-card:hover { transform:translateY(-2px); box-shadow:0 14px 38px rgba(76,20,181,.09); }
.account-disabled { opacity:.78; background:#FBFAFC; }
.account-card-top { display:flex; gap:12px; align-items:flex-start; }
.account-avatar { width:49px; height:49px; border-radius:16px; display:grid; place-items:center; flex:0 0 auto; color:#fff; font-size:22px; font-weight:700; background:linear-gradient(135deg,var(--lamaah-deep),var(--lamaah-lavender)); box-shadow:0 8px 18px rgba(76,20,181,.18); }
.account-title { flex:1; min-width:0; }
.title-line { display:flex; align-items:center; gap:8px; justify-content:space-between; }
.title-line h3 { margin:0; color:var(--lamaah-950); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.account-title small { color:var(--muted); margin-top:3px; display:block; }
.slug { margin-top:6px; color:var(--lamaah-royal); font-size:12px; text-align:right; }
.account-state { flex:0 0 auto; border-radius:999px; padding:5px 9px; font-size:10px; font-weight:700; }
.state-active { background:#E9F8F1; color:#15754F; }
.state-trial { background:#F1E9FF; color:#5C24B6; }
.state-expired { background:#FFF3E6; color:#9A5817; }
.state-suspended { background:#FDECEC; color:#A52D27; }
.account-metrics { display:grid; grid-template-columns:repeat(4,1fr); gap:7px; margin-top:16px; }
.account-metrics > div { text-align:center; padding:9px 4px; border-radius:11px; background:#FAF7FF; border:1px solid #EEE5F9; }
.account-metrics strong,.account-metrics span { display:block; }
.account-metrics strong { color:var(--lamaah-deep); font-size:17px; }
.account-metrics span { color:var(--muted); font-size:10px; margin-top:3px; }
.account-meta { display:grid; gap:5px; margin-top:14px; color:var(--muted); font-size:11px; }
.account-actions { display:flex; justify-content:flex-end; margin-top:15px; padding-top:13px; border-top:1px solid #F1ECF7; }
.danger-soft,.success-soft { border:0; border-radius:11px; padding:8px 12px; font-weight:700; }
.danger-soft { background:#FFF0EF; color:#A52D27; }
.success-soft { background:#EAF9F2; color:#15754F; }
.danger-soft:disabled,.success-soft:disabled { opacity:.55; cursor:wait; }
.platform-empty { max-width:none; text-align:center; padding:34px; }
.platform-empty strong { color:var(--lamaah-950); font-size:18px; }
.platform-empty p { margin-bottom:0; }
.home-platform-action { margin-top:18px; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:20px 22px; border-radius:18px; background:linear-gradient(135deg,#fff,#F8F2FF); border:1px solid var(--line); }
.home-platform-action strong,.home-platform-action span { display:block; }
.home-platform-action strong { color:var(--lamaah-950); }
.home-platform-action span { margin-top:5px; color:var(--muted); font-size:12px; }

@media (max-width: 1050px) {
    .platform-summary { grid-template-columns:repeat(2,1fr); }
    .accounts-grid { grid-template-columns:1fr; }
}
@media (max-width: 680px) {
    .platform-head { flex-direction:column; }
    .platform-head .head-actions,.platform-head .primary-action { width:100%; }
    .platform-summary,.platform-stats { grid-template-columns:1fr 1fr; }
    .account-create-title,.create-footer,.home-platform-action { flex-direction:column; align-items:stretch; }
    .account-create-title { position:relative; padding-inline-end:58px; }
    .icon-close { position:absolute; inset-inline-end:16px; top:16px; }
    .setup-sections { padding-inline:16px; }
    .create-footer { padding-inline:16px; }
    .create-footer .form-actions { width:100%; }
    .create-footer .form-actions button { flex:1; }
    .account-metrics { grid-template-columns:1fr 1fr; }
}

/* Self-service laundry registration */
.login-register-box {
    margin-top: 15px;
    padding: 13px 14px;
    border: 1px dashed #D8C6F6;
    border-radius: 14px;
    background: #FAF7FF;
    display: grid;
    gap: 5px;
    text-align: center;
}
.login-register-box span { color: var(--muted); font-size: 12px; }
.login-register-box a { color: var(--lamaah-deep); font-weight: 800; text-decoration: none; }
.login-register-box a:hover { text-decoration: underline; }
.register-laundry-page { align-items: start; padding-block: 30px; }
.register-laundry-card {
    width: min(1120px,96vw);
    background: rgba(255,255,255,.97);
    padding: 28px 32px 30px;
    border: 1px solid #E5D8F7;
    border-radius: 28px;
    box-shadow: 0 30px 90px rgba(76,20,181,.17);
}
.compact-brand img { width: min(100%,250px); max-height: 105px; }
.register-title { text-align:center; max-width:720px; margin:0 auto 22px; }
.register-title h1 { margin:8px 0 5px; color:var(--lamaah-950); }
.register-title p { margin:0; color:var(--muted); line-height:1.8; }
.auth-badge { display:inline-flex; padding:5px 11px; border-radius:999px; background:var(--lamaah-100); color:var(--lamaah-deep); font-size:11px; font-weight:800; }
.register-grid { display:grid; gap:16px; }
.register-section { border:1px solid #E9DFF6; border-radius:19px; padding:18px; background:#FFF; }
.register-section-title { display:flex; gap:11px; align-items:center; margin-bottom:15px; }
.register-section-title > span { width:32px; height:32px; border-radius:10px; display:grid; place-items:center; color:#fff; background:linear-gradient(135deg,var(--lamaah-deep),var(--lamaah-lavender)); font-weight:800; }
.register-section-title div { display:grid; gap:2px; }
.register-section-title strong { color:var(--lamaah-950); }
.register-section-title small { color:var(--muted); }
.currency-choice { max-width:520px; }
.currency-choice > label { display:block; margin-bottom:7px; color:#43286C; font-size:13px; font-weight:700; }
.currency-choice select { width:100%; padding:12px; border:1px solid #DCCDF1; border-radius:11px; background:#FDFBFF; outline:none; }
.currency-choice select:focus { border-color:var(--lamaah-lavender); box-shadow:0 0 0 3px rgba(165,108,255,.13); }
.currency-preview { display:flex; align-items:center; gap:12px; margin-top:12px; padding:12px 14px; border-radius:14px; background:#F6F0FF; }
.currency-preview > span { min-width:48px; min-height:48px; border-radius:13px; display:grid; place-items:center; background:#fff; color:var(--lamaah-deep); font-weight:900; border:1px solid #E0D0F6; }
.currency-preview div { display:grid; gap:2px; }
.currency-preview strong { color:var(--lamaah-950); }
.currency-preview small { color:var(--muted); direction:ltr; text-align:right; }
.register-actions { display:flex; flex-direction:column; align-items:center; gap:10px; margin-top:20px; }
.register-submit { width:min(100%,430px); padding:13px 18px; }
.auth-link-button { border:0; background:transparent; color:var(--lamaah-deep); font-weight:700; cursor:pointer; padding:7px 12px; }
.auth-link-button:disabled { opacity:.55; cursor:wait; }
.registration-hint { margin:17px auto 0; max-width:720px; text-align:center; color:#78678F; font-size:12px; line-height:1.8; }
.notice-error { background:#FFF1F1; border-color:#F5CACA; color:#A52828; }
.input-prefix { display:flex; align-items:center; border:1px solid #DCCDF1; border-radius:11px; background:#FDFBFF; overflow:hidden; }
.input-prefix > span { padding-inline:11px 4px; color:#8B78A5; direction:ltr; }
.input-prefix input { border:0 !important; box-shadow:none !important; background:transparent !important; margin:0 !important; }
@media(max-width:680px){
    .register-laundry-page { padding:12px; }
    .register-laundry-card { padding:20px 15px 24px; border-radius:21px; }
    .register-section { padding:14px; }
}

/* Manual subscription renewal */
.renewal-panel { border-color:#CFC0EE; }
.account-actions { gap:8px; flex-wrap:wrap; }
.renew-soft { border:0; border-radius:11px; padding:8px 12px; font-weight:700; background:#F1E9FF; color:#5C24B6; }
.renew-soft:disabled { opacity:.55; cursor:wait; }
.money-input { display:flex; direction:ltr; border:1px solid #DCCDF1; border-radius:11px; background:#FDFBFF; overflow:hidden; }
.money-input input { border:0 !important; border-radius:0 !important; box-shadow:none !important; min-width:0; }
.money-input span { display:grid; place-items:center; padding:0 12px; background:#F5EEFF; color:var(--lamaah-deep); font-weight:700; border-left:1px solid #E4D8F4; white-space:nowrap; }
.renewal-history { display:grid; gap:9px; }
.renewal-history-row { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px 14px; border:1px solid #E9E0F5; border-radius:13px; background:#FCFAFF; }
.renewal-history-row > div { min-width:0; }
.renewal-history-row strong,.renewal-history-row span,.renewal-history-row small { display:block; }
.renewal-history-row strong { color:var(--lamaah-950); }
.renewal-history-row span { margin-top:4px; color:var(--muted); font-size:11px; }
.renewal-history-row small { margin-top:5px; color:#745A94; }
.renewal-history-row bdi { flex:0 0 auto; color:var(--lamaah-deep); font-weight:800; }
.renewal-empty { padding:16px; border:1px dashed #DCCDF1; border-radius:13px; background:#FCFAFF; color:var(--muted); text-align:center; }
.small-loading { padding:14px; }
@media (max-width: 680px) {
    .renewal-history-row { align-items:flex-start; flex-direction:column; }
    .account-actions > button { flex:1; }
}

/* Public laundry link and QR sharing */
.share-page { width:100%; }
.share-head {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:20px;
    margin-bottom:24px;
}
.share-head h1 { margin:0 0 8px; color:var(--lamaah-950); font-size:28px; }
.share-head p { margin:0; color:var(--muted); font-size:13px; }
.share-open-button {
    border:0;
    border-radius:13px;
    padding:12px 20px;
    min-width:112px;
    background:linear-gradient(135deg,var(--lamaah-deep),var(--lamaah-royal));
    color:#fff;
    font-weight:800;
    box-shadow:0 10px 24px rgba(76,20,181,.22);
}
.share-open-button:disabled { opacity:.55; cursor:wait; }
.share-layout {
    display:grid;
    grid-template-columns:360px minmax(0,1fr);
    gap:20px;
    align-items:stretch;
}
.share-qr-card,
.share-main-card {
    background:#fff;
    border:1px solid #DED6E9;
    border-radius:18px;
    box-shadow:0 10px 32px rgba(54,29,92,.055);
}
.share-qr-card {
    padding:32px 21px 22px;
    text-align:center;
    display:flex;
    flex-direction:column;
    align-items:center;
}
.qr-frame {
    width:min(100%,280px);
    aspect-ratio:1;
    padding:8px;
    border:1px solid #E1DADF;
    border-radius:12px;
    background:#fff;
    display:grid;
    place-items:center;
    box-shadow:0 5px 16px rgba(35,24,48,.035);
}
.qr-frame img { width:100%; height:100%; object-fit:contain; display:block; }
.share-qr-card h2 { margin:27px 0 8px; color:var(--lamaah-950); font-size:20px; }
.share-qr-card p { margin:0 0 20px; color:var(--muted); font-size:12px; line-height:1.8; }
.qr-download {
    width:100%;
    border:0;
    border-radius:12px;
    padding:12px 15px;
    background:linear-gradient(135deg,var(--lamaah-deep),var(--lamaah-royal));
    color:#fff;
    font-weight:800;
}
.qr-download:disabled { opacity:.6; cursor:wait; }
.share-main-card { padding:28px 24px; }
.share-kicker { display:block; color:var(--lamaah-deep); font-size:12px; font-weight:900; margin-bottom:8px; }
.share-main-card h2 { margin:0 0 9px; color:var(--lamaah-950); font-size:25px; }
.share-description { color:var(--muted); margin:0 0 22px; line-height:1.8; font-size:13px; }
.share-link-row {
    display:grid;
    grid-template-columns:minmax(0,1fr) 74px;
    direction:ltr;
    gap:9px;
}
.share-link-row input {
    width:100%;
    min-width:0;
    border:1px solid #DDD5E4;
    border-radius:11px;
    background:#fff;
    padding:12px 14px;
    color:#31293A;
    outline:none;
    text-align:left;
}
.share-link-row button {
    border:0;
    border-radius:11px;
    background:var(--lamaah-deep);
    color:#fff;
    font-weight:800;
}
.share-actions-row {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:12px;
    margin-top:16px;
    direction:rtl;
}
.whatsapp-share,
.plain-share {
    border:0;
    border-radius:12px;
    padding:11px 16px;
    font-weight:800;
}
.whatsapp-share { background:#20AA5A; color:#fff; }
.plain-share { background:transparent; color:var(--lamaah-950); }
.plain-share:hover { background:#F8F4FD; }
.share-action-message { color:var(--success); font-size:11px; font-weight:700; }
.share-divider { height:1px; background:#ECE7EF; margin:25px 0; }
.share-main-card h3 { margin:0 0 16px; color:var(--lamaah-950); font-size:17px; }
.share-suggestions {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px 30px;
}
.share-suggestions > div {
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    column-gap:10px;
    align-items:start;
    padding:8px 0;
}
.share-suggestions > div > span {
    grid-row:1 / span 2;
    width:32px;
    height:32px;
    border-radius:10px;
    display:grid;
    place-items:center;
    background:var(--lamaah-100);
    color:var(--lamaah-deep);
    font-size:10px;
    font-weight:900;
}
.share-suggestions strong { color:var(--lamaah-950); font-size:13px; }
.share-suggestions small { color:var(--muted); margin-top:4px; line-height:1.6; }

.public-laundry-page {
    --public-primary:#4C14B5;
    --public-secondary:#2D0A68;
    --public-accent:#A56CFF;
    min-height:100vh;
    color:#241B2D;
    background:
        radial-gradient(circle at 92% 5%, color-mix(in srgb, var(--public-accent) 20%, transparent), transparent 24rem),
        #F7F6F9;
}
.public-laundry-hero {
    padding:28px clamp(20px,6vw,90px);
    background:linear-gradient(135deg,#fff 0%,color-mix(in srgb,var(--public-primary) 5%,#fff) 100%);
    border-bottom:1px solid #E7E1EB;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    position:sticky;
    top:0;
    z-index:5;
    box-shadow:0 7px 24px rgba(28,17,39,.045);
}
.public-brand-row { display:flex; align-items:center; gap:15px; min-width:0; }
.public-laundry-logo {
    width:68px;
    height:68px;
    flex:0 0 auto;
    border-radius:20px;
    background:#fff;
    border:1px solid #E5DFE9;
    display:grid;
    place-items:center;
    padding:7px;
    box-shadow:0 8px 24px rgba(38,22,55,.08);
}
.public-laundry-logo img { width:100%; height:100%; object-fit:contain; border-radius:14px; }
.public-powered { display:block; color:var(--public-primary); font-size:10px; font-weight:900; margin-bottom:3px; }
.public-brand-row h1 { margin:0; color:var(--public-secondary); font-size:25px; overflow:hidden; text-overflow:ellipsis; }
.public-brand-row small { display:block; margin-top:3px; color:#82758D; }
.public-hero-actions { display:flex; gap:9px; flex-wrap:wrap; }
.public-hero-actions button,
.public-hero-actions a {
    border:0;
    border-radius:12px;
    padding:10px 15px;
    text-decoration:none;
    font-weight:800;
    font-size:12px;
}
.public-hero-actions button { background:var(--public-primary); color:#fff; }
.public-whatsapp { background:#20AA5A; color:#fff; }
.public-laundry-content { width:min(1180px,92vw); margin:0 auto; padding:34px 0 48px; }
.public-info-grid {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    margin-bottom:28px;
}
.public-info-grid > div,
.public-order-info > div {
    background:#fff;
    border:1px solid #E7E1EB;
    border-radius:16px;
    padding:15px 16px;
    box-shadow:0 7px 22px rgba(36,22,49,.04);
}
.public-info-grid span,
.public-info-grid strong,
.public-order-info span,
.public-order-info strong { display:block; }
.public-info-grid span,
.public-order-info span { color:#85798F; font-size:10px; margin-bottom:6px; }
.public-info-grid strong,
.public-order-info strong { color:var(--public-secondary); font-size:13px; }
.public-services-section {
    background:#fff;
    border:1px solid #E7E1EB;
    border-radius:22px;
    padding:24px;
    box-shadow:0 10px 34px rgba(36,22,49,.045);
}
.public-section-title { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:20px; }
.public-section-title span { color:var(--public-primary); font-size:11px; font-weight:900; }
.public-section-title h2 { margin:5px 0 0; color:var(--public-secondary); }
.public-section-title > strong { color:var(--public-primary); background:color-mix(in srgb,var(--public-primary) 9%,#fff); border-radius:999px; padding:7px 11px; font-size:11px; }
.public-services-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.public-service-card {
    display:grid;
    grid-template-columns:42px minmax(0,1fr) auto;
    gap:12px;
    align-items:center;
    border:1px solid #ECE6EF;
    border-radius:16px;
    padding:14px;
    background:#FEFDFE;
    transition:.18s ease;
}
.public-service-card:hover { transform:translateY(-1px); border-color:color-mix(in srgb,var(--public-primary) 28%,#E7E1EB); box-shadow:0 9px 22px rgba(36,22,49,.055); }
.service-icon { width:40px; height:40px; border-radius:13px; display:grid; place-items:center; background:color-mix(in srgb,var(--public-primary) 10%,#fff); color:var(--public-primary); font-size:19px; }
.service-copy { min-width:0; }
.service-copy h3 { margin:0; color:var(--public-secondary); font-size:14px; }
.service-copy p { margin:5px 0 0; color:#84788E; font-size:10px; line-height:1.6; }
.service-copy small { display:block; margin-top:6px; color:#9A8FA3; }
.service-price { text-align:left; white-space:nowrap; }
.service-price span,.service-price strong { display:block; }
.service-price span { color:#918597; font-size:9px; margin-bottom:4px; }
.service-price strong { color:var(--public-primary); font-size:12px; }
.public-empty { padding:28px; border:1px dashed #DCD3E1; border-radius:14px; text-align:center; color:#817487; background:#FBFAFC; }
.public-order-info { display:flex; flex-wrap:wrap; gap:12px; margin-top:16px; }
.public-order-info > div { min-width:190px; flex:1; }
.public-laundry-footer {
    min-height:92px;
    border-top:1px solid #E5DFE8;
    background:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    padding:18px;
}
.public-laundry-footer img { width:42px; height:42px; object-fit:contain; }
.public-laundry-footer strong,.public-laundry-footer small { display:block; }
.public-laundry-footer strong { color:var(--lamaah-deep); }
.public-laundry-footer small { color:#91839D; margin-top:3px; font-size:10px; }
.public-laundry-state {
    min-height:100vh;
    display:grid;
    place-items:center;
    align-content:center;
    gap:12px;
    text-align:center;
    padding:24px;
}
.public-laundry-state img { width:90px; height:90px; object-fit:contain; }
.public-laundry-state h1 { margin:8px 0 0; }
.public-laundry-state p { max-width:470px; margin:0; color:#807489; line-height:1.8; }

@media(max-width:1000px) {
    .share-layout { grid-template-columns:310px minmax(0,1fr); }
    .public-info-grid { grid-template-columns:repeat(2,1fr); }
    .public-services-grid { grid-template-columns:1fr; }
}
@media(max-width:760px) {
    .share-head { align-items:stretch; flex-direction:column; }
    .share-open-button { width:100%; }
    .share-layout { grid-template-columns:1fr; }
    .share-qr-card { order:2; }
    .share-main-card { order:1; }
    .share-suggestions { grid-template-columns:1fr; }
    .public-laundry-hero { position:relative; flex-direction:column; align-items:stretch; padding:20px; }
    .public-hero-actions { width:100%; }
    .public-hero-actions button,.public-hero-actions a { flex:1; text-align:center; }
    .public-laundry-content { width:min(94vw,680px); padding-top:20px; }
    .public-info-grid { grid-template-columns:1fr; }
    .public-services-section { padding:16px; }
    .public-service-card { grid-template-columns:40px minmax(0,1fr); }
    .service-price { grid-column:2; text-align:right; padding-top:5px; }
    .public-section-title { align-items:flex-start; }
}
@media(max-width:480px) {
    .share-main-card { padding:20px 16px; }
    .share-link-row { grid-template-columns:minmax(0,1fr) 64px; }
    .public-brand-row h1 { font-size:20px; }
    .public-laundry-logo { width:58px; height:58px; border-radius:17px; }
}

/* Platform trial and subscription settings */
.subscription-settings-card {
    position: relative;
    margin-top: 20px;
    padding: 28px 28px 22px;
    background: linear-gradient(135deg,#FFFFFF 0%,#FFFEFB 58%,#FFF9EB 100%);
    border: 1px solid #E9D6A2;
    border-top: 4px solid #E8B70D;
    border-radius: 18px;
    box-shadow: 0 14px 36px rgba(71,43,10,.07);
    overflow: hidden;
}
.subscription-settings-card::after {
    content: "";
    position: absolute;
    width: 230px;
    height: 230px;
    left: -115px;
    top: -120px;
    border-radius: 50%;
    background: rgba(232,183,13,.07);
    pointer-events: none;
}
.subscription-settings-head { padding-inline-start: 150px; }
.subscription-settings-head > span {
    display: block;
    color: var(--lamaah-deep);
    font-size: 12px;
    font-weight: 800;
    margin-bottom: 6px;
}
.subscription-settings-head h2 {
    margin: 0;
    color: #2F213E;
    font-size: 24px;
}
.subscription-settings-head p {
    margin: 7px 0 0;
    color: #8B7480;
    line-height: 1.8;
    font-size: 12px;
}
.subscription-price-badge {
    position: absolute;
    z-index: 2;
    top: 27px;
    left: 22px;
    width: 120px;
    min-height: 82px;
    border-radius: 15px;
    display: grid;
    place-content: center;
    text-align: center;
    background: linear-gradient(145deg,var(--lamaah-deep),#351078);
    color: #fff;
    box-shadow: 0 10px 24px rgba(76,20,181,.18);
}
.subscription-price-badge strong {
    color: #FFD719;
    font-size: 17px;
    line-height: 1.25;
}
.subscription-price-badge span {
    margin-top: 5px;
    font-size: 10px;
    color: #F2E9FF;
}
.subscription-settings-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 14px;
    margin-top: 22px;
}
.subscription-settings-grid label {
    display: grid;
    gap: 8px;
    color: #3E2C3D;
    font-size: 12px;
    font-weight: 800;
}
.subscription-settings-grid input,
.subscription-settings-grid select {
    width: 100%;
    height: 62px;
    padding: 12px 14px;
    border: 1px solid #E7D49A;
    border-radius: 11px;
    background: rgba(255,255,255,.92);
    color: #241B2A;
    outline: none;
    font-weight: 700;
}
.subscription-settings-grid input:focus,
.subscription-settings-grid select:focus {
    border-color: #DDB017;
    box-shadow: 0 0 0 3px rgba(232,183,13,.14);
}
.subscription-settings-grid small {
    min-height: 17px;
    color: #8A7A70;
    font-size: 10px;
    font-weight: 500;
}
.subscription-settings-footer {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 18px;
    margin-top: 16px;
}
.subscription-setting-note { display: grid; gap: 4px; color: #6E5D66; }
.subscription-setting-note strong { color: #372839; font-size: 12px; }
.subscription-setting-note span { font-size: 11px; }
.subscription-setting-note small { font-size: 10px; color: #91808B; }
.subscription-save-button {
    min-width: 265px;
    min-height: 46px;
    border: 0;
    border-radius: 12px;
    padding: 11px 20px;
    background: linear-gradient(135deg,var(--lamaah-deep),#351078);
    color: #fff;
    font-weight: 800;
    box-shadow: 0 10px 20px rgba(76,20,181,.18);
}
.subscription-save-button:disabled { opacity: .62; cursor: wait; }
.state-pending { background:#FFF8DD; color:#8C6600; }

@media (max-width: 1050px) {
    .subscription-settings-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 680px) {
    .subscription-settings-card { padding: 20px 16px; }
    .subscription-price-badge {
        position: static;
        width: 100%;
        min-height: 68px;
        margin-bottom: 16px;
    }
    .subscription-settings-head { padding-inline-start: 0; }
    .subscription-settings-grid { grid-template-columns: 1fr; }
    .subscription-settings-grid input,
    .subscription-settings-grid select { height: 52px; }
    .subscription-settings-footer { align-items: stretch; flex-direction: column; }
    .subscription-save-button { min-width: 0; width: 100%; }
}


/* Full viewport + premium 3D web presentation */
html, body, #app { width:100%; min-height:100%; }
body { overflow-x:hidden; }
.shell { width:100%; min-height:100dvh; align-items:stretch; }
.sidebar { position:sticky; top:0; height:100dvh; flex:0 0 292px; width:292px; }
.content { width:calc(100% - 292px); max-width:none; min-height:100dvh; padding:clamp(18px,2vw,34px); overflow:auto; }
.content > * { width:100%; max-width:none; }
.page-head, .editor-card, .grid, .account-create-panel, .home-platform-action { width:100%; }
.stats { grid-template-columns:repeat(4,minmax(180px,1fr)); }
.cards { grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); }
.empty-card { max-width:none; }
.public-laundry-content { width:min(1600px,96vw); }

.page-head, .stats > div, .card, .editor-card, .account-card, .home-platform-action {
    box-shadow:0 16px 42px rgba(76,20,181,.08), 0 2px 0 rgba(255,255,255,.9) inset;
}
.page-head { min-height:145px; background:linear-gradient(135deg,#fff 0%,#FBF7FF 48%,#EBDFFF 100%); }
.stats > div { transition:transform .18s ease, box-shadow .18s ease; background:linear-gradient(145deg,#fff,#FBF8FF); }
.stats > div:hover { transform:translateY(-4px); box-shadow:0 22px 50px rgba(76,20,181,.13); }
.grid { box-shadow:0 14px 40px rgba(76,20,181,.07); }
.grid th { position:sticky; top:0; z-index:2; }

.dashboard-hero { margin-top:18px; min-height:230px; display:grid; grid-template-columns:1.25fr .75fr; gap:20px; align-items:center; padding:28px 30px; border:1px solid #DCCBF4; border-radius:30px; background:radial-gradient(circle at 18% 10%,rgba(255,255,255,.95),transparent 32%),linear-gradient(135deg,#FDFBFF 0%,#EEE2FF 46%,#D8BCFF 100%); box-shadow:0 22px 60px rgba(76,20,181,.13); overflow:hidden; position:relative; }
.dashboard-hero::before,.dashboard-hero::after{content:"";position:absolute;border-radius:999px;pointer-events:none}.dashboard-hero::before{width:240px;height:240px;left:-80px;bottom:-145px;background:rgba(255,255,255,.45)}.dashboard-hero::after{width:150px;height:150px;right:33%;top:-90px;background:rgba(165,108,255,.18)}
.dashboard-hero > * { position:relative; z-index:1; }
.dashboard-hero h2 { margin:0 0 9px; color:var(--lamaah-950); font-size:clamp(28px,3vw,46px); line-height:1.2; }
.dashboard-hero p { margin:0; color:#66557E; font-size:14px; line-height:1.8; }
.dashboard-hero .hero-badges { display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; }
.dashboard-hero .hero-badges span { padding:8px 12px; border:1px solid rgba(76,20,181,.14); border-radius:999px; background:rgba(255,255,255,.72); color:var(--lamaah-deep); font-size:12px; font-weight:700; box-shadow:0 6px 18px rgba(76,20,181,.07); }
.dashboard-visual { min-height:170px; display:grid; place-items:center; }
.dashboard-visual img { width:min(290px,82%); max-height:190px; object-fit:contain; filter:drop-shadow(0 24px 28px rgba(76,20,181,.22)); transform:perspective(700px) rotateY(-8deg) rotateX(3deg); }
.dashboard-grid { display:grid; grid-template-columns:1.4fr .9fr; gap:18px; margin-top:18px; }
.dashboard-panel { background:linear-gradient(145deg,#fff,#FBF8FF); border:1px solid var(--line); border-radius:24px; padding:20px; box-shadow:0 16px 42px rgba(76,20,181,.07); }
.dashboard-panel h3 { margin:0 0 14px; color:var(--lamaah-950); }
.quick-list { display:grid; gap:10px; }
.quick-list > div { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:13px 14px; border-radius:16px; border:1px solid #ECE3F7; background:#FCFAFF; }
.quick-list strong { color:var(--lamaah-deep); }

@media(max-width:1100px){.sidebar{flex-basis:235px;width:235px}.content{width:calc(100% - 235px)}.stats{grid-template-columns:repeat(2,minmax(170px,1fr))}.dashboard-hero{grid-template-columns:1fr}.dashboard-visual{min-height:120px}.dashboard-grid{grid-template-columns:1fr}}
@media(max-width:680px){.sidebar{position:relative;width:100%;height:auto}.content{width:100%;min-height:auto;padding:16px}.dashboard-hero{padding:20px;border-radius:24px}.dashboard-hero h2{font-size:30px}.dashboard-visual img{width:210px}.stats{grid-template-columns:1fr}.page-head{min-height:auto}}

/* Database image storage */
.settings-editor-full{display:grid;gap:22px}
.db-image-section{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:24px;align-items:center;padding:22px;border:1px solid #e4d8f8;border-radius:24px;background:linear-gradient(135deg,#fff 0%,#f8f3ff 100%);box-shadow:0 14px 34px rgba(76,20,181,.07)}
.db-image-copy h2{margin:6px 0;color:#2d0a68}.db-image-copy p{margin:6px 0 16px;color:#6f6380;line-height:1.8}
.db-image-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:8px}
.image-upload-button{display:inline-flex!important;align-items:center;justify-content:center;min-height:44px;padding:0 18px;border-radius:14px;background:linear-gradient(135deg,#4c14b5,#7c3aed);color:white!important;font-weight:800;cursor:pointer;box-shadow:0 8px 20px rgba(76,20,181,.18)}
.image-upload-button input[type=file]{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.selected-image-name{display:block;color:#4c14b5!important;font-weight:700;margin:8px 0}
.db-image-preview{width:220px;height:170px;border-radius:24px;border:1px solid #dcccf6;background:#fff;display:grid;place-items:center;overflow:hidden;box-shadow:0 12px 28px rgba(76,20,181,.10)}
.db-image-preview img{width:100%;height:100%;object-fit:contain;padding:14px}
.image-placeholder{display:flex;flex-direction:column;gap:8px;align-items:center;color:#8a78aa}.image-placeholder span{font-size:34px;color:#7c3aed}
.service-image-thumb{width:76px;height:76px;border-radius:20px;object-fit:cover;border:1px solid #dfd0f7;background:#fff;box-shadow:0 8px 20px rgba(76,20,181,.09)}
.image-admin-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.image-admin-row .image-upload-button{min-height:36px;padding:0 12px;font-size:12px;border-radius:11px}
@media(max-width:760px){.db-image-section{grid-template-columns:1fr}.db-image-preview{width:100%;height:190px}}
.service-image-cards{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))!important}
.service-image-card{display:grid;grid-template-columns:86px 1fr;gap:14px;align-items:center}
.service-card-copy{display:flex;flex-direction:column;gap:4px;min-width:0}.service-card-copy strong{color:#2d0a68;font-size:17px}.service-card-copy small{color:#776987}
.service-image-card .image-admin-row{grid-column:1/-1;padding-top:10px;border-top:1px solid #eee5fa}
.public-service-image{object-fit:cover;padding:0!important;overflow:hidden;background:#fff}
.garment-images-head{margin-top:34px}

/* ================================================================
   Orders Operations Center
   ================================================================ */
.orders-ops-page{width:100%;max-width:none;margin:0}.orders-hero{align-items:center}.orders-head-actions{display:flex;gap:10px;flex-wrap:wrap}.notice-error{background:#FFF0F2!important;border-color:#FFD1D8!important;color:#9F1239!important}
.orders-kpis{display:grid;grid-template-columns:repeat(5,minmax(155px,1fr));gap:13px;margin-top:18px}.ops-kpi{position:relative;overflow:hidden;background:linear-gradient(145deg,#fff,#FCFAFF);border:1px solid var(--line);border-radius:18px;padding:16px 17px;box-shadow:0 8px 26px rgba(76,20,181,.045);min-height:105px}.ops-kpi:after{content:"";position:absolute;inset-inline-end:-28px;top:-34px;width:92px;height:92px;border-radius:50%;background:rgba(165,108,255,.10)}.ops-kpi span,.ops-kpi strong,.ops-kpi small{display:block;position:relative;z-index:1}.ops-kpi span{color:var(--muted);font-size:12px}.ops-kpi strong{font-size:27px;color:var(--lamaah-deep);margin:6px 0}.ops-kpi small{color:#9385A8}.danger-kpi strong{color:#C2415B}.money-kpi strong{font-size:23px;color:#087F5B}
.orders-filter-card{margin-top:16px;background:#fff;border:1px solid var(--line);border-radius:20px;padding:17px 18px;box-shadow:0 8px 28px rgba(76,20,181,.04)}.orders-filter-title{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:13px}.orders-filter-title strong,.orders-filter-title small{display:block}.orders-filter-title strong{color:var(--lamaah-950)}.orders-filter-title small{color:var(--muted);margin-top:3px}.orders-filter-title>span{background:var(--lamaah-100);color:var(--lamaah-deep);font-size:12px;font-weight:800;border-radius:999px;padding:6px 11px}.orders-filter-grid{display:grid;grid-template-columns:1.6fr repeat(6,minmax(120px,1fr));gap:10px;align-items:end}.orders-filter-grid label{display:grid;gap:6px;font-size:11px;font-weight:800;color:#4C356C}.orders-filter-grid input,.orders-filter-grid select,.payment-form-grid input,.payment-form-grid select,.ops-textarea{width:100%;border:1px solid #DED2EF;background:#FCFAFF;color:var(--ink);border-radius:11px;padding:10px 11px;outline:none;min-height:40px}.orders-filter-grid input:focus,.orders-filter-grid select:focus,.payment-form-grid input:focus,.payment-form-grid select:focus,.ops-textarea:focus{border-color:var(--lamaah-lavender);box-shadow:0 0 0 3px rgba(165,108,255,.12);background:#fff}.orders-filter-grid .span-2{grid-column:span 2}.ops-check{display:flex!important;align-items:center;gap:8px;min-height:40px;background:#FAF7FF;border:1px solid #E8DDF7;border-radius:11px;padding:7px 10px}.ops-check input{width:17px!important;min-height:auto!important}.ops-check span{display:block}.ops-check strong,.ops-check small{display:block}.ops-check small{font-weight:500;color:var(--muted);margin-top:1px}.filter-actions{display:flex;align-items:end}.filter-actions .primary-action{width:100%;min-height:40px}
.status-lane{display:flex;gap:8px;overflow-x:auto;padding:14px 1px 4px;scrollbar-width:thin}.lane-item{display:flex;align-items:center;gap:7px;white-space:nowrap;border:1px solid #E8DFF4;background:#fff;color:#5B496D;border-radius:999px;padding:8px 11px;cursor:pointer;transition:.18s ease}.lane-item:hover,.lane-item.active{border-color:#C9AEF2;background:#F5EEFF;color:var(--lamaah-deep);box-shadow:0 5px 15px rgba(76,20,181,.08)}.lane-item strong{min-width:24px;height:24px;display:grid;place-items:center;border-radius:999px;background:#F0E8FA;font-size:11px}.status-dot{width:9px;height:9px;border-radius:50%;display:inline-block}.status-all{background:#7C6A91}
.orders-table-card{margin-top:12px;background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden;box-shadow:0 10px 34px rgba(76,20,181,.05)}.orders-table-wrap{overflow:auto;max-height:calc(100vh - 430px);min-height:260px}.orders-table{width:100%;min-width:1180px;border-collapse:separate;border-spacing:0}.orders-table th{position:sticky;top:0;z-index:2;background:#F8F3FF;color:#503A70;font-size:11px;font-weight:800;padding:12px 13px;text-align:right;border-bottom:1px solid #E7DBF6}.orders-table td{padding:12px 13px;border-bottom:1px solid #F0EAF7;vertical-align:middle;font-size:12px}.orders-table tbody tr{cursor:pointer;transition:.15s ease}.orders-table tbody tr:hover{background:#FCFAFF}.orders-table td strong,.orders-table td small{display:block}.orders-table td small{color:var(--muted);margin-top:4px}.order-number{color:var(--lamaah-deep);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;direction:ltr;text-align:right}.overdue-row{background:linear-gradient(90deg,#FFF8F8,#fff 40%)}.late-text{color:#C2415B!important;font-weight:700}.ops-status,.payment-state,.driver-chip{display:inline-flex;align-items:center;border-radius:999px;padding:5px 9px;font-weight:800;font-size:10px}.driver-chip{background:#EEF8FF;color:#16658A}.payment-paid{background:#E8F8F0;color:#087F5B}.payment-partial{background:#FFF7E5;color:#A46100}.payment-pending{background:#F2EDFA;color:#68547C}.payment-failed{background:#FFE9EC;color:#B4233C}.payment-refunded{background:#EAF1FF;color:#315EA8}
.status-new{background:#F2EDFA!important;color:#65527A!important}.status-confirmed{background:#E9F2FF!important;color:#245B9C!important}.status-pickup{background:#E7F7FF!important;color:#147594!important}.status-received{background:#EEF9F4!important;color:#1B765A!important}.status-washing{background:#EDEBFF!important;color:#5C45C8!important}.status-ironing{background:#F6EBFF!important;color:#7A3DB2!important}.status-ready{background:#E4FAF1!important;color:#087F5B!important}.status-delivery{background:#E8F4FF!important;color:#1D6FA5!important}.status-delivered{background:#DFF7EB!important;color:#047857!important}.status-hold{background:#FFF5D9!important;color:#9A6200!important}.status-cancelled{background:#FFE7EB!important;color:#B4233C!important}
.ops-loading,.ops-empty{min-height:230px;display:flex;align-items:center;justify-content:center;gap:13px;color:var(--muted);text-align:center}.ops-loading span{width:27px;height:27px;border:3px solid #E6D7FA;border-top-color:var(--lamaah-royal);border-radius:50%;animation:opsSpin .8s linear infinite}.ops-loading strong,.ops-loading small,.ops-empty strong,.ops-empty span{display:block}.ops-loading small{margin-top:4px}.ops-empty{flex-direction:column}.ops-empty strong{font-size:17px;color:var(--lamaah-950)}@keyframes opsSpin{to{transform:rotate(360deg)}}
.ops-overlay{position:fixed;inset:0;z-index:2000;background:rgba(26,10,49,.48);backdrop-filter:blur(5px);display:flex;justify-content:flex-start}.ops-drawer{width:min(790px,94vw);height:100vh;background:#F8F5FC;box-shadow:25px 0 70px rgba(31,8,65,.28);overflow-y:auto;padding:0 20px 28px;animation:drawerIn .22s ease}@keyframes drawerIn{from{transform:translateX(-35px);opacity:.75}to{transform:none;opacity:1}}.drawer-loading{height:100vh}.drawer-head{position:sticky;top:0;z-index:10;margin:0 -20px;padding:18px 20px 15px;background:rgba(255,255,255,.96);backdrop-filter:blur(15px);border-bottom:1px solid #E8DDF4;display:flex;align-items:center;justify-content:space-between;gap:14px}.drawer-head h2{margin:7px 0 2px;color:var(--lamaah-950);font-size:24px;direction:ltr;text-align:right;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.drawer-head p{margin:0;color:var(--muted)}.drawer-title-line{display:flex;gap:7px;flex-wrap:wrap}.drawer-head-actions{display:flex;gap:8px}.drawer-close,.drawer-print{border:1px solid #DED0F0;background:#fff;color:var(--lamaah-deep);border-radius:11px;height:39px;padding:0 13px;font-weight:800}.drawer-close{font-size:22px;width:41px;padding:0}.drawer-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-top:16px}.drawer-summary>div{background:#fff;border:1px solid #E6DBF3;border-radius:14px;padding:12px}.drawer-summary span,.drawer-summary strong{display:block}.drawer-summary span{color:var(--muted);font-size:10px}.drawer-summary strong{color:var(--lamaah-950);margin-top:5px;font-size:14px}.paid-color{color:#087F5B!important}.due-color{color:#B4233C!important}.drawer-tabs{display:flex;gap:6px;overflow-x:auto;margin:13px 0}.drawer-tabs button{white-space:nowrap;border:1px solid #E2D7F0;background:#fff;color:#6B577E;border-radius:10px;padding:9px 12px;font-weight:800;font-size:11px}.drawer-tabs button.active{background:linear-gradient(135deg,var(--lamaah-deep),var(--lamaah-royal));border-color:transparent;color:#fff;box-shadow:0 7px 15px rgba(76,20,181,.16)}
.drawer-section{background:#fff;border:1px solid #E7DCF4;border-radius:17px;padding:16px;margin-top:11px;box-shadow:0 7px 22px rgba(76,20,181,.035)}.section-title{display:flex;justify-content:space-between;gap:12px;margin-bottom:13px}.section-title strong,.section-title small{display:block}.section-title strong{color:var(--lamaah-950)}.section-title small{margin-top:3px;color:var(--muted)}.order-info-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.order-info-grid>div{background:#FAF8FD;border:1px solid #EEE7F6;border-radius:11px;padding:10px}.order-info-grid span,.order-info-grid strong,.order-info-grid small{display:block}.order-info-grid span{font-size:10px;color:var(--muted)}.order-info-grid strong{margin-top:4px;color:#3A2555}.order-info-grid small{margin-top:3px;color:var(--muted)}.order-info-grid .span-2{grid-column:span 2}.workflow-actions{display:flex;gap:7px;flex-wrap:wrap}.workflow-btn{border:0;border-radius:10px;padding:9px 12px;font-weight:800;cursor:pointer}.workflow-btn:disabled{opacity:.5;cursor:wait}.ops-textarea{margin-top:10px;resize:vertical}.inline-empty{background:#FAF8FD;border:1px dashed #DCCFEB;border-radius:11px;padding:13px;color:var(--muted);text-align:center}.success-box{background:#E9F9F1;border:1px solid #BFECD7;color:#087F5B;border-radius:11px;padding:12px;font-weight:800}
.order-items-list{display:grid;gap:9px}.order-item-card{display:grid;grid-template-columns:minmax(180px,1.4fr) auto 115px;gap:10px;align-items:center;border:1px solid #ECE3F5;background:#FDFBFF;border-radius:13px;padding:11px}.item-main strong,.item-main span,.item-main small,.item-price strong,.item-price small{display:block}.item-main span,.item-main small{color:var(--muted);margin-top:3px}.condition-note{color:#9B5F08!important}.item-flags{display:flex;gap:4px;flex-wrap:wrap}.flag{font-size:9px;font-weight:800;padding:4px 7px;border-radius:999px}.flag.stain{background:#FFF4D7;color:#965D00}.flag.damage{background:#FFE8EC;color:#B4233C}.flag.photo{background:#E8F2FF;color:#2A619A}.item-price{text-align:left}.item-price strong{color:var(--lamaah-deep)}.item-price small{color:var(--muted);margin-top:3px}.barcode-box{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:10px;border-top:1px dashed #E4D8F1;padding-top:8px}.barcode-box span{font-size:9px;text-transform:uppercase;letter-spacing:.12em;color:#927FA8}.barcode-box strong{direction:ltr;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;color:#3C2855}.totals-section{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.totals-section>div{background:#FAF8FD;border-radius:10px;padding:9px}.totals-section span,.totals-section strong{display:block}.totals-section span{font-size:10px;color:var(--muted)}.totals-section strong{margin-top:4px}.totals-section .grand-total{grid-column:1/-1;background:linear-gradient(135deg,#F4EAFF,#EEE1FF);display:flex;align-items:center;justify-content:space-between}.grand-total strong{font-size:20px;color:var(--lamaah-deep)}
.payment-form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:12px}.payment-form-grid label{display:grid;gap:6px;font-size:11px;font-weight:800;color:#4C356C}.payment-form-grid .span-2{grid-column:span 2}.payment-history,.driver-task-list{display:grid;gap:8px}.payment-history>div,.driver-task-row{display:flex;align-items:center;gap:10px;border:1px solid #EEE5F6;background:#FCFAFF;border-radius:12px;padding:10px}.payment-history>div>div,.driver-task-row>div{flex:1}.payment-history strong,.payment-history small,.driver-task-row strong,.driver-task-row small{display:block}.payment-history small,.driver-task-row small{color:var(--muted);margin-top:3px}.payment-icon,.task-icon{width:30px;height:30px;display:grid;place-items:center;border-radius:9px;background:#E8F8F0;color:#087F5B;font-weight:900}.task-icon{background:#EFE7FF;color:var(--lamaah-deep)}.payment-record-status,.task-state{font-size:9px;font-weight:800;padding:4px 7px;border-radius:999px;background:#E9F8F1;color:#087F5B}.task-waiting{background:#FFF4D9;color:#936000}.task-assigned{background:#E8F1FF;color:#2B5E9B}.task-accepted{background:#EEE7FF;color:#6142B4}.task-completed{background:#E6F8EF;color:#087F5B}.task-cancelled{background:#FFE8EC;color:#B4233C}
.order-timeline{display:grid}.timeline-row{position:relative;display:grid;grid-template-columns:22px 1fr;gap:8px;padding:0 0 18px}.timeline-row:not(:last-child):after{content:"";position:absolute;right:7px;top:15px;bottom:0;width:2px;background:#E4D8F1}.timeline-node{position:relative;z-index:1;width:16px;height:16px;border-radius:50%;margin-top:2px;border:3px solid #fff;box-shadow:0 0 0 1px #D8C7EC}.timeline-row strong,.timeline-row span,.timeline-row small{display:block}.timeline-row>div>span{font-size:10px;color:#8A779E;margin-top:2px}.timeline-row small{font-size:10px;color:var(--muted);margin-top:3px}
@media(max-width:1450px){.orders-kpis{grid-template-columns:repeat(3,1fr)}.orders-filter-grid{grid-template-columns:repeat(4,1fr)}.orders-filter-grid .span-2{grid-column:span 2}}
@media(max-width:900px){.orders-kpis{grid-template-columns:repeat(2,1fr)}.orders-filter-grid{grid-template-columns:repeat(2,1fr)}.drawer-summary{grid-template-columns:repeat(2,1fr)}.order-item-card{grid-template-columns:1fr 110px}.item-flags{grid-column:1}.item-price{grid-column:2;grid-row:1}.totals-section{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.orders-head-actions{width:100%}.orders-head-actions button{flex:1}.orders-kpis{grid-template-columns:1fr 1fr}.orders-filter-grid{grid-template-columns:1fr}.orders-filter-grid .span-2{grid-column:auto}.ops-drawer{width:100vw;padding-inline:13px}.drawer-head{margin-inline:-13px;padding-inline:13px}.drawer-summary{grid-template-columns:1fr 1fr}.order-info-grid,.payment-form-grid{grid-template-columns:1fr}.order-info-grid .span-2,.payment-form-grid .span-2{grid-column:auto}.order-item-card{display:block}.item-flags,.item-price,.barcode-box{margin-top:8px}.item-price{text-align:right}.orders-kpis .ops-kpi{padding:13px}.ops-kpi strong{font-size:22px}}
@media print{body{background:#fff!important}.sidebar,.orders-ops-page,.drawer-tabs,.drawer-head-actions,.no-print{display:none!important}.content{padding:0!important;overflow:visible!important}.ops-overlay{position:static!important;display:block!important;background:none!important;backdrop-filter:none!important}.ops-drawer{width:100%!important;height:auto!important;overflow:visible!important;box-shadow:none!important;background:#fff!important;padding:0!important}.drawer-head{position:static!important;margin:0!important;padding:0 0 12px!important;border-bottom:2px solid #3D1967!important}.drawer-summary{margin-top:12px}.drawer-section{box-shadow:none!important;break-inside:avoid}.order-item-card{break-inside:avoid}.barcode-box strong{font-size:12px}.drawer-head h2{font-size:22px}}
/* Intake-condition photo preview inside the operations drawer */
.intake-image-thumb{width:74px;height:68px;object-fit:cover;border-radius:11px;border:1px solid #decfed;box-shadow:0 5px 14px rgba(68,25,105,.10);grid-row:1/span 2}
@media(max-width:900px){.intake-image-thumb{width:64px;height:60px}}
.order-item-card.with-intake-image{grid-template-columns:74px minmax(180px,1.4fr) auto 115px}.order-item-card.with-intake-image .intake-image-thumb{grid-column:1;grid-row:1/3}.order-item-card.with-intake-image .item-main{grid-column:2}.order-item-card.with-intake-image .item-flags{grid-column:3}.order-item-card.with-intake-image .item-price{grid-column:4}.order-item-card.with-intake-image .barcode-box{grid-column:1/-1}
@media(max-width:900px){.order-item-card.with-intake-image{grid-template-columns:64px minmax(0,1fr) 110px}.order-item-card.with-intake-image .item-main{grid-column:2}.order-item-card.with-intake-image .item-flags{grid-column:2}.order-item-card.with-intake-image .item-price{grid-column:3;grid-row:1}.order-item-card.with-intake-image .barcode-box{grid-column:1/-1}}
@media(max-width:620px){.order-item-card.with-intake-image{display:grid;grid-template-columns:64px 1fr}.order-item-card.with-intake-image .intake-image-thumb{grid-column:1;grid-row:1}.order-item-card.with-intake-image .item-main{grid-column:2}.order-item-card.with-intake-image .item-flags,.order-item-card.with-intake-image .item-price,.order-item-card.with-intake-image .barcode-box{grid-column:1/-1}}
.orders-head-actions a.primary-action{text-decoration:none;display:inline-flex;align-items:center;justify-content:center}

/* Sidebar viewport fix: keep brand/footer visible and scroll the menu itself */
.sidebar {
    overflow: hidden;
    min-height: 0;
}

.sidebar > .brand {
    flex: 0 0 auto;
}

.main-nav {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: rgba(226, 211, 255, .70) rgba(255, 255, 255, .06);
    padding-inline: 2px 6px;
    padding-bottom: 12px;
    margin-inline-end: -5px;
}

.main-nav::-webkit-scrollbar {
    width: 6px;
}

.main-nav::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, .05);
    border-radius: 999px;
}

.main-nav::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, rgba(228, 214, 255, .85), rgba(174, 132, 255, .72));
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, .14);
}

.main-nav::-webkit-scrollbar-thumb:hover {
    background: rgba(239, 230, 255, .92);
}

.sidebar-footer {
    flex: 0 0 auto;
    margin-top: 0;
    padding-top: 10px;
    background: linear-gradient(180deg, rgba(61, 18, 143, 0), rgba(43, 8, 101, .94) 28%);
}

/* Make short laptop screens more comfortable before scrolling is needed. */
@media (min-width: 681px) and (max-height: 860px) {
    .sidebar {
        padding-top: 12px;
        padding-bottom: 12px;
    }
    .brand {
        padding: 8px 10px;
        margin-bottom: 10px;
        border-radius: 16px;
    }
    .brand-logo {
        height: 58px;
    }
    .main-nav {
        gap: 3px;
    }
    .main-nav a {
        padding: 9px 11px;
        border-radius: 11px;
    }
    .nav-section-label {
        margin-top: 7px;
        margin-bottom: 3px;
        font-size: 10px;
    }
    .nav-icon {
        width: 22px;
        font-size: 16px;
    }
    .brand-mini {
        padding-top: 9px;
        margin-bottom: 8px;
    }
    .brand-mini img {
        width: 34px;
        height: 34px;
    }
    .logout {
        padding: 8px;
    }
}

@media (max-width: 680px) {
    .sidebar {
        overflow: visible;
        min-height: auto;
    }
    .main-nav {
        flex: none;
        min-height: auto;
        overflow: visible;
        margin-inline-end: 0;
        padding-inline: 0;
    }
    .sidebar-footer {
        background: transparent;
    }
}

/* Public storefront identity / cover editor */
.cover-image-section{grid-template-columns:minmax(0,1fr) minmax(320px,460px)}
.cover-preview{width:100%;height:220px;border-radius:24px}
.cover-preview img{width:100%;height:100%;object-fit:cover;padding:0}
.form-grid textarea{width:100%;resize:vertical;min-height:96px;border:1px solid var(--line);border-radius:14px;padding:12px 14px;background:#fff;color:var(--text);font:inherit;outline:none}
.form-grid textarea:focus{border-color:var(--lamaah-500);box-shadow:0 0 0 3px rgba(124,58,237,.10)}
@media(max-width:900px){.cover-image-section{grid-template-columns:1fr}.cover-preview{height:210px}}

/* Login password visibility toggle — unified official build 2026-09-18 */
.password-field {
    position: relative;
    width: 100%;
}

.password-field input {
    width: 100%;
    padding-left: 52px;
}

.login-card .password-toggle {
    position: absolute;
    left: 9px;
    top: 50%;
    transform: translateY(-50%);
    width: 38px !important;
    height: 38px !important;
    min-width: 38px;
    padding: 0 !important;
    margin: 3px 0 0 !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #6d48bd;
    cursor: pointer;
    border-radius: 50%;
    z-index: 2;
}

.login-card .password-toggle:hover:not(:disabled) {
    transform: translateY(-50%);
    background: rgba(109, 72, 189, .09) !important;
    color: #4c14b5;
    box-shadow: none !important;
}

.login-card .password-toggle:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(109, 72, 189, .14) !important;
}

.login-card .password-toggle svg {
    pointer-events: none;
}