/* =========================================================================
   پارسیان من — سامانه جامع خدمات شهروندی شهرداری پارسیان
   Design language: a coastal Hormozgan municipality issuing official
   documents (permits, certificates, tracking codes) — so the identity
   leans on two things from that world: the deep teal of the Persian Gulf
   against warm sand, and the scalloped "official seal" (مهر) shape used
   on stamped municipal paperwork. Vazirmatn is the only typeface (a
   second Latin display face would mismatch Persian metrics and break
   RTL rhythm) — its own wide weight range does the typographic work
   instead: near-black headings against regular-weight body text.
   All class/ID names are unchanged from the previous stylesheet — this
   only restyles what is already hooked up in templates/*.php and
   assets/js/public.js.
   ========================================================================= */

:where(.p137-box, .p137-admin) {
    --ink: #17231f;
    --ink-soft: #55655c;
    --ink-faint: #8a9790;
    --teal-900: #0a4547;
    --teal-800: #0d5457;
    --teal-700: #12676a;
    --teal-600: #187f7c;
    --teal-500: #219690;
    --teal-100: #e2f0ec;
    --teal-50: #f0f8f6;
    --sand-50: #faf5e8;
    --sand-100: #f2e7cd;
    --sand-200: #e8d6ab;
    --gold-600: #c1852e;
    --gold-700: #9c6b22;
    --line: #e6dfc9;
    --line-soft: #efe9d8;
    --surface: #fffdf7;
    --danger: #ae3b34;
    --danger-bg: #fbeae8;
    --radius-lg: 20px;
    --radius-md: 13px;
    --radius-sm: 9px;
    --shadow-card: 0 1px 2px rgba(35, 25, 5, .04), 0 18px 40px -20px rgba(10, 40, 35, .28);
    --shadow-pop: 0 10px 24px -10px rgba(10, 45, 40, .35);
}

/* ---------- Base card ---------- */
.p137-box {
    max-width: 560px;
    margin: 20px auto;
    padding: 26px;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
    font-family: 'Vazirmatn', 'Tahoma', 'IRANSans', sans-serif;
    line-height: 1.8;
    color: var(--ink);
    box-sizing: border-box;
    box-shadow: var(--shadow-card);
}
.p137-box, .p137-box * { box-sizing: border-box; }
.p137-box h2, .p137-box h3, .p137-box h4 { font-weight: 800; line-height: 1.4; letter-spacing: -0.01em; color: var(--ink); }
.p137-box h3 { margin: 0 0 6px; font-size: 18px; }
.p137-box h4 { font-size: 15px; }
.p137-box label { display: block; margin: 16px 0 6px; font-weight: 600; font-size: 13.5px; color: var(--ink-soft); }
.p137-box p { line-height: 1.85; color: var(--ink-soft); }
.p137-box input[type=text],
.p137-box input[type=tel],
.p137-box input[type=password],
.p137-box input[type=number],
.p137-box input[type=date],
.p137-box input[type=time],
.p137-box input[type=file],
.p137-box select,
.p137-box textarea {
    width: 100%;
    padding: 12px 14px;
    border: 1.5px solid var(--line);
    border-radius: var(--radius-sm);
    box-sizing: border-box;
    font-family: inherit;
    font-size: 16px; /* keeps iOS Safari from auto-zooming on focus */
    background: var(--sand-50);
    color: var(--ink);
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}
.p137-box input::placeholder,
.p137-box textarea::placeholder { color: var(--ink-faint); }
.p137-box input:focus,
.p137-box select:focus,
.p137-box textarea:focus {
    outline: none;
    border-color: var(--teal-600);
    box-shadow: 0 0 0 3px var(--teal-100);
    background: var(--surface);
}
.p137-box textarea { line-height: 1.75; }

/* Primary action — deep gulf-teal, matching the seal/badge system below. */
.p137-btn {
    margin-top: 20px;
    padding: 13px 26px;
    background: linear-gradient(180deg, var(--teal-600) 0%, var(--teal-800) 100%);
    color: #fff;
    border: none;
    border-radius: var(--radius-sm);
    cursor: pointer;
    font-family: inherit;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 0.01em;
    width: 100%;
    box-shadow: 0 8px 18px -8px rgba(10, 69, 71, .55);
    transition: transform 0.12s ease, box-shadow 0.12s ease, filter 0.12s ease;
}
.p137-btn:hover { filter: brightness(1.06); box-shadow: 0 10px 22px -8px rgba(10, 69, 71, .6); }
.p137-btn:active { transform: scale(0.99); box-shadow: 0 4px 10px -6px rgba(10, 69, 71, .5); }

.p137-alert { margin-top: 16px; padding: 13px 16px; border-radius: var(--radius-sm); font-size: 14px; line-height: 1.75; border: 1px solid transparent; }
.p137-ok { background: var(--teal-50); color: var(--teal-900); border-color: #bfe1da; }
.p137-err { background: var(--danger-bg); color: var(--danger); border-color: #f0c6c2; }
.p137-alert--info { background: var(--sand-50); color: var(--ink-soft); border-color: var(--line); }

/* Base tab strip (used standalone, outside the hub/auth pill variants below). */
.p137-tabs { display: flex; gap: 8px; margin-bottom: 18px; }
.p137-tab-btn {
    flex: 1;
    padding: 11px;
    border: 1.5px solid var(--line);
    background: var(--sand-50);
    color: var(--ink-soft);
    cursor: pointer;
    border-radius: var(--radius-sm);
    font-family: inherit;
    font-weight: 600;
    font-size: 14px;
    transition: color 0.2s ease, background 0.2s ease, border-color 0.2s ease;
}
.p137-tab-btn.active { background: var(--teal-800); color: #fff; border-color: var(--teal-800); }

@media (max-width: 420px) {
    .p137-box { padding: 18px; margin: 12px auto; border-radius: 16px; }
}

/* ---------- Signature: geometric header band + scalloped seal badge ----------
   Grounded in the subject: this system issues stamped official documents
   (permits, certificates, tracking codes), so the brand mark is styled
   as a municipal seal (مهر) rather than a plain colored circle, sitting
   on a faint girih-lattice band evoking Persian civic tilework. */
.p137-auth-head {
    position: relative;
    padding: 36px 28px 26px;
    text-align: center;
    background:
        radial-gradient(circle at 50% -20%, rgba(255,255,255,.5), transparent 60%),
        linear-gradient(180deg, var(--teal-900) 0%, var(--teal-800) 100%);
    background-image:
        radial-gradient(circle at 50% -20%, rgba(255,255,255,.5), transparent 60%),
        linear-gradient(180deg, var(--teal-900) 0%, var(--teal-800) 100%),
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56' viewBox='0 0 56 56'%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='0.09' stroke-width='1'%3E%3Cpath d='M28 0L56 28L28 56L0 28Z'/%3E%3Cpath d='M28 10L46 28L28 46L10 28Z'/%3E%3C/g%3E%3C/svg%3E");
    background-repeat: no-repeat, no-repeat, repeat;
    overflow: hidden;
}
.p137-auth-badge {
    position: relative;
    width: 62px;
    height: 62px;
    margin: 0 auto 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--teal-900);
    font-weight: 800;
    font-size: 16px;
    letter-spacing: 0.3px;
    font-variant-numeric: tabular-nums;
    background:
        radial-gradient(circle, #fbead0 0%, var(--sand-100) 72%);
    /* Twelve-point scalloped seal outline, drawn with a repeating conic
       mask so it works at any size without a hand-plotted polygon. */
    -webkit-mask-image: radial-gradient(circle at 50% 50%, #000 61%, transparent 61.6%),
        repeating-conic-gradient(#000 0deg 15deg, transparent 15deg 30deg);
    -webkit-mask-composite: source-over, xor;
    mask-image: radial-gradient(circle at 50% 50%, #000 61%, transparent 61.6%),
        repeating-conic-gradient(#000 0deg 15deg, transparent 15deg 30deg);
    mask-composite: add, exclude;
    box-shadow: var(--shadow-pop);
}
.p137-auth-head h2 {
    position: relative;
    margin: 0 0 5px;
    font-size: 20px;
    font-weight: 800;
    letter-spacing: -0.01em;
    color: #fff;
}
.p137-auth-head p {
    position: relative;
    margin: 0;
    font-size: 13px;
    color: rgba(255,255,255,.72);
}

.p137-box--auth {
    max-width: 420px;
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-card);
}

/* Auth pill (login/register — always exactly 2 tabs, so an equal-width
   segmented control fits without wrapping or clipping on any screen). */
.p137-box--auth .p137-tabs {
    position: relative;
    display: flex;
    margin: 20px 26px 0;
    padding: 4px;
    background: var(--sand-100);
    border-radius: 999px;
    gap: 4px;
}
.p137-box--auth .p137-tab-btn {
    flex: 1;
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border: none;
    border-radius: 999px;
    background: transparent;
    color: var(--ink-soft);
    font-family: inherit;
    font-weight: 700;
    font-size: 14px;
    padding: 10px 0;
    cursor: pointer;
    transition: color 0.25s ease, transform 0.15s ease;
}

/* Hub strip — up to 5 tabs, so this is a horizontally-scrollable row of
   individually-sized chips instead of a forced equal-width pill. */
.p137-box--hub .p137-tabs {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    gap: 8px;
    margin: 18px 20px 0;
    padding: 2px 2px 12px;
}
.p137-box--hub .p137-tabs::-webkit-scrollbar { display: none; }
.p137-box--hub .p137-tab-btn {
    flex: 0 0 auto;
    position: relative;
    display: flex;
    align-items: center;
    gap: 7px;
    white-space: nowrap;
    border: 1.5px solid transparent;
    border-radius: 999px;
    background: var(--sand-100);
    color: var(--ink-soft);
    font-family: inherit;
    font-weight: 700;
    font-size: 13.5px;
    padding: 9px 16px;
    cursor: pointer;
    transition: color 0.2s ease, background 0.2s ease, transform 0.15s ease, border-color 0.2s ease;
}

/* Icon set — small line glyphs via mask-image (currentColor-tintable),
   matching each tab to what it does rather than a stock emoji set. */
.p137-box--auth .p137-tab-btn::before,
.p137-box--hub .p137-tab-btn::before {
    content: "";
    display: inline-block;
    width: 15px;
    height: 15px;
    flex-shrink: 0;
    background-color: currentColor;
    opacity: 0.8;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
}
.p137-box--auth .p137-tab-btn[data-tab="login"]::before,
.p137-box--hub .p137-tab-btn[data-tab="hub-auth"]::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='7' cy='12' r='4'/%3E%3Cpath d='M11 12h10M17 12v4M20 12v3'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='7' cy='12' r='4'/%3E%3Cpath d='M11 12h10M17 12v4M20 12v3'/%3E%3C/svg%3E");
}
.p137-box--auth .p137-tab-btn[data-tab="register"]::before,
.p137-box--hub .p137-tab-btn[data-tab="hub-new"]::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M11 4H6a2 2 0 00-2 2v12a2 2 0 002 2h12a2 2 0 002-2v-5'/%3E%3Cpath d='M18.4 2.6a2 2 0 012.9 2.9L12 15l-4 1 1-4 9.4-9.4z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M11 4H6a2 2 0 00-2 2v12a2 2 0 002 2h12a2 2 0 002-2v-5'/%3E%3Cpath d='M18.4 2.6a2 2 0 012.9 2.9L12 15l-4 1 1-4 9.4-9.4z'/%3E%3C/svg%3E");
}
/* «فراموشی رمز» — سومین تب auth؛ آیکون قفل باز، هم‌خانواده‌ی همان ست خطی بالا. */
.p137-box--auth .p137-tab-btn[data-tab="forgot"]::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='11' width='16' height='10' rx='2'/%3E%3Cpath d='M7 11V7a5 5 0 019.5-2.2'/%3E%3Ccircle cx='12' cy='16' r='1.6'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='11' width='16' height='10' rx='2'/%3E%3Cpath d='M7 11V7a5 5 0 019.5-2.2'/%3E%3Ccircle cx='12' cy='16' r='1.6'/%3E%3C/svg%3E");
}
.p137-box--hub .p137-tab-btn[data-tab="hub-track"]::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M21 21l-4.3-4.3'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M21 21l-4.3-4.3'/%3E%3C/svg%3E");
}
.p137-box--hub .p137-tab-btn[data-tab="hub-mine"]::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='4' width='14' height='17' rx='2'/%3E%3Cpath d='M9 4V3a1 1 0 011-1h4a1 1 0 011 1v1'/%3E%3Cpath d='M9 8h6M9 12h6M9 16h6'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='4' width='14' height='17' rx='2'/%3E%3Cpath d='M9 4V3a1 1 0 011-1h4a1 1 0 011 1v1'/%3E%3Cpath d='M9 8h6M9 12h6M9 16h6'/%3E%3C/svg%3E");
}
.p137-box--hub .p137-tab-btn[data-tab="hub-appt"]::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M16 3v4M8 3v4M3 10h18'/%3E%3Cpath d='M8.5 15l2 2 4-4'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M16 3v4M8 3v4M3 10h18'/%3E%3Cpath d='M8.5 15l2 2 4-4'/%3E%3C/svg%3E");
}
.p137-box--hub .p137-tab-btn[data-tab="hub-service"]::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21h18'/%3E%3Cpath d='M5 21V9l7-5 7 5v12'/%3E%3Cpath d='M9 21v-6h6v6'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21h18'/%3E%3Cpath d='M5 21V9l7-5 7 5v12'/%3E%3Cpath d='M9 21v-6h6v6'/%3E%3C/svg%3E");
}

.p137-box--auth .p137-tab-btn:hover:not(.active),
.p137-box--hub .p137-tab-btn:hover:not(.active) {
    color: var(--ink);
    border-color: var(--line);
}
.p137-box--auth .p137-tab-btn:active,
.p137-box--hub .p137-tab-btn:active {
    transform: scale(0.97);
}
.p137-box--auth .p137-tab-btn.active,
.p137-box--hub .p137-tab-btn.active {
    background: linear-gradient(180deg, var(--teal-600) 0%, var(--teal-800) 100%);
    color: #fff;
    border-color: transparent;
    box-shadow: 0 4px 10px -4px rgba(10, 69, 71, .5);
}
.p137-box--auth .p137-tab-btn.active::before,
.p137-box--hub .p137-tab-btn.active::before { opacity: 1; }

.p137-box--auth .p137-tab,
.p137-box--hub .p137-tab {
    padding: 24px 28px 28px;
    animation: p137-tab-fade 0.28s ease;
}
@keyframes p137-tab-fade {
    from { opacity: 0; transform: translateY(5px); }
    to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
    .p137-box--auth .p137-tab,
    .p137-box--hub .p137-tab { animation: none; }
}

.p137-box--auth label { font-size: 13px; color: var(--ink-soft); }
.p137-box--auth input[type=text],
.p137-box--auth input[type=tel],
.p137-box--auth input[type=password] {
    border-color: var(--line);
    border-radius: var(--radius-sm);
    padding: 12px 14px;
}
.p137-box--auth input:focus {
    outline: none;
    border-color: var(--teal-600);
    box-shadow: 0 0 0 3px var(--teal-100);
}
.p137-box--auth .p137-btn {
    width: 100%;
    border-radius: var(--radius-sm);
    font-weight: 700;
    padding: 13px 24px;
}
.p137-box--auth .p137-btn:hover { filter: brightness(1.1); }
.p137-box--auth .p137-captcha {
    background: var(--sand-50);
    border: 1.5px dashed var(--sand-200);
}
.p137-box--auth #p137-auth-result {
    margin: 0 28px 24px;
}

/* ---------- Hub (unified tabbed shortcode: new / track / auth-or-mine) ---------- */
/* =========================================================================
   .p137-auth2 — چیدمان دوستونه‌ی صفحه‌ی مستقل ورود/ثبت‌نام/فراموشی‌رمز
   (فقط وقتی $standalone=true؛ حالت nested داخل هاب همان .p137-box--auth
   قبلی و تک‌ستونه می‌ماند). پالت رنگی از همین سیستم طراحی (teal/sand/gold)
   است، نه رنگ‌های جدا — تا با بقیه‌ی سایت یک‌دست بماند.
   ========================================================================= */
.p137-auth2 {
    max-width: 900px;
    display: grid;
    grid-template-columns: 38% 62%;
    align-items: stretch;
}
.p137-auth2-brand {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    text-align: center;
    padding: 40px 26px;
    color: #fff;
    background:
        radial-gradient(circle at 85% -10%, rgba(255,255,255,.16), transparent 45%),
        linear-gradient(160deg, var(--teal-900) 0%, var(--teal-800) 55%, var(--teal-600) 130%);
}
.p137-auth2-brand:after {
    content: "";
    position: absolute;
    inset: auto -90px -110px auto;
    width: 260px;
    height: 260px;
    border-radius: 50%;
    background: rgba(255,255,255,.07);
}
.p137-auth2-badge {
    position: relative;
    z-index: 1;
    width: 84px;
    height: 84px;
    margin-top: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--teal-900);
    font-weight: 800;
    font-size: 20px;
    font-variant-numeric: tabular-nums;
    background: radial-gradient(circle, #fbead0 0%, var(--sand-100) 72%);
    -webkit-mask-image: radial-gradient(circle at 50% 50%, #000 61%, transparent 61.6%),
        repeating-conic-gradient(#000 0deg 15deg, transparent 15deg 30deg);
    -webkit-mask-composite: source-over, xor;
    mask-image: radial-gradient(circle at 50% 50%, #000 61%, transparent 61.6%),
        repeating-conic-gradient(#000 0deg 15deg, transparent 15deg 30deg);
    mask-composite: add, exclude;
    box-shadow: var(--shadow-pop);
}
.p137-auth2-brand-bottom { position: relative; z-index: 1; margin-bottom: 8px; }
.p137-auth2-brand-bottom strong { display: block; font-size: 24px; font-weight: 800; margin-bottom: 8px; }
.p137-auth2-brand-bottom span { font-size: 13px; line-height: 2; color: rgba(255,255,255,.78); }
.p137-auth2-main { padding: 34px 30px; }
.p137-auth2-main .p137-auth-head { background: none; padding: 0 0 22px; text-align: right; overflow: visible; }
.p137-auth2-main .p137-auth-head h2 { color: var(--ink); font-size: 22px; }
.p137-auth2-main .p137-auth-head p { color: var(--ink-soft); }
.p137-auth2-main .p137-tabs { margin: 0 0 18px; }
@media (max-width: 760px) {
    .p137-auth2 { grid-template-columns: 1fr; }
    .p137-auth2-brand { padding: 26px 20px; flex-direction: row; justify-content: center; gap: 16px; }
    .p137-auth2-badge { width: 54px; height: 54px; font-size: 14px; margin-top: 0; }
    .p137-auth2-brand-bottom { text-align: right; margin-bottom: 0; }
    .p137-auth2-brand-bottom strong { font-size: 17px; margin-bottom: 2px; }
    .p137-auth2-brand-bottom span { display: none; }
    .p137-auth2-main { padding: 24px 18px; }
}

.p137-box--hub {
    max-width: 560px;
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-card);
}
/* A form/track/dashboard .p137-box rendered inside a hub tab loses its own
   card chrome — the hub box is already providing it — so panels don't
   double up on borders/padding. */
.p137-box--hub .p137-tab .p137-box {
    max-width: none;
    margin: 0;
    padding: 0;
    border: none;
    border-radius: 0;
    box-shadow: none;
}
/* The login/register block, when nested inside the hub's "auth" tab,
   also drops its own card chrome and inner tab-strip margins (the hub
   panel padding already supplies the spacing). */
.p137-box--nested {
    max-width: none;
    border: none;
    border-radius: 0;
    box-shadow: none;
}
.p137-box--nested .p137-tabs { margin: 0 0 16px; }
.p137-box--nested .p137-tab { padding: 0; }
.p137-box--nested #p137-auth-result { margin: 0; }
.p137-map {
    height: 260px;
    width: 100%;
    margin-top: 10px;
    border-radius: var(--radius-sm);
    border: 1.5px solid var(--line);
    z-index: 1;
}
.p137-map-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px;
}
.p137-map-btn {
    padding: 7px 14px;
    font-size: 13px;
    font-weight: 600;
    border-radius: var(--radius-sm);
    border: 1.5px solid var(--line);
    background: var(--sand-50);
    color: var(--ink-soft);
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}
.p137-map-btn:hover { background: var(--sand-100); color: var(--ink); }
.p137-map-hint { font-size: 12px; color: var(--ink-faint); }

/* ---------- Status / SLA color-coded badges (admin + tracking) ----------
   Hues carried over from the previous palette (already distinct and
   readable) so status meaning stays consistent for returning citizens
   and staff; only warmed slightly to sit on the new sand/teal surfaces. */
.p137-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 11px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}
.p137-badge::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: currentColor;
}
.p137-badge--registered { background: #e6f0fb; color: #1a5fa8; }
.p137-badge--reviewing   { background: #fdf3d8; color: #8f6a10; }
.p137-badge--referred    { background: #efe6fb; color: #6b3fa0; }
.p137-badge--in_progress { background: var(--teal-100); color: var(--teal-900); }
.p137-badge--resolved    { background: #e6f5ea; color: #1a6b34; }
.p137-badge--rejected    { background: var(--danger-bg); color: var(--danger); }

/* Appointment (ملاقات با شهردار) statuses. */
.p137-badge--pending     { background: #e6f0fb; color: #1a5fa8; }
.p137-badge--confirmed   { background: #e6f5ea; color: #1a6b34; }
.p137-badge--rescheduled { background: #fdf3d8; color: #8f6a10; }
.p137-badge--done        { background: var(--teal-100); color: var(--teal-900); }
.p137-badge--cancelled   { background: #efece2; color: #6b6a5c; }
.p137-badge--no_show     { background: var(--danger-bg); color: var(--danger); }

/* Service requests (پروانه ساختمان، گواهی عدم خلاف) — 'rejected' reuses the request badge above. */
.p137-badge--submitted        { background: #e6f0fb; color: #1a5fa8; }
.p137-badge--docs_review      { background: #fdf3d8; color: #8f6a10; }
.p137-badge--technical_review { background: #efe6fb; color: #6b3fa0; }
.p137-badge--site_visit       { background: #fdf3d8; color: #8f6a10; }
.p137-badge--fee_pending      { background: #fdf3d8; color: #8f6a10; }
.p137-badge--issued           { background: #e6f5ea; color: #1a6b34; }

.p137-sla {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 700;
}
.p137-sla::before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: currentColor;
    flex-shrink: 0;
}
.p137-sla--ok       { color: #1a6b34; }
.p137-sla--warning  { color: #8f6a10; }
.p137-sla--overdue  { color: var(--danger); }
.p137-sla--closed   { color: var(--ink-faint); }

/* تاریخ دوزبانه (شمسی | میلادی) — هرجا تقویم نمایش داده می‌شود. */
.p137-date-dual { display: inline-flex; gap: 5px; align-items: baseline; flex-wrap: wrap; }
.p137-date-sep { color: var(--ink-soft, #9aa4b8); }
.p137-date-g { color: var(--ink-soft, #9aa4b8); font-size: .92em; direction: ltr; }

.p137-table { width: 100%; border-collapse: collapse; margin-top: 12px; }
.p137-table th, .p137-table td { padding: 11px 8px; border-bottom: 1px solid var(--line-soft); text-align: right; font-size: 13.5px; }
.p137-table thead th { color: var(--ink-soft); font-weight: 700; font-size: 12.5px; }
.p137-table tbody tr:hover { background: var(--sand-50); }

.p137-track-summary {
    margin-top: 20px;
    padding: 18px 20px;
    background: var(--sand-50);
    border: 1px solid var(--line-soft);
    border-radius: var(--radius-md);
}
.p137-track-summary > p { margin: 6px 0; font-size: 14px; }
.p137-track-summary h4 { margin: 18px 0 10px; font-size: 14px; color: var(--ink); }
.p137-track-summary ul {
    list-style: none;
    margin: 0;
    padding: 0;
    border-right: 2px solid var(--line);
    margin-right: 4px;
}
.p137-track-summary li {
    position: relative;
    padding: 0 20px 16px 0;
    margin-right: 0;
    font-size: 13px;
    color: var(--ink-soft);
    line-height: 1.8;
}
.p137-track-summary li::before {
    content: "";
    position: absolute;
    right: -5px;
    top: 6px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--teal-700);
    border: 2px solid var(--surface);
    box-shadow: 0 0 0 1px var(--line);
}
.p137-track-summary li:last-child { padding-bottom: 0; }

.p137-empty {
    padding: 26px 16px;
    text-align: center;
    color: var(--ink-faint);
    font-size: 13.5px;
    background: var(--sand-50);
    border-radius: var(--radius-md);
    border: 1.5px dashed var(--sand-200);
}
.p137-captcha { margin-top: 16px; padding: 13px; background: var(--sand-50); border: 1.5px dashed var(--sand-200); border-radius: var(--radius-sm); }
.p137-captcha label { font-weight: 700; margin-bottom: 6px; color: var(--ink); }
.p137-btn-ghost {
    padding: 6px 14px;
    font-size: 12.5px;
    font-family: inherit;
    font-weight: 700;
    border-radius: 999px;
    border: 1.5px solid #e3bdb9;
    background: var(--surface);
    color: var(--danger);
    cursor: pointer;
    transition: background 0.15s ease;
}
.p137-btn-ghost:hover { background: var(--danger-bg); }
.p137-doc-link {
    display: inline-block;
    margin: 2px 4px 2px 0;
    padding: 4px 11px;
    border-radius: 999px;
    background: var(--teal-100);
    color: var(--teal-900);
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
}
.p137-doc-link:hover { background: #d3e9e2; }

/* Native file inputs render very differently per browser/OS — this gets
   them at least visually in line with the rest of the form. */
.p137-box input[type=file] {
    padding: 10px 10px;
    background: var(--sand-50);
    cursor: pointer;
}
.p137-box input[type=file]::file-selector-button {
    margin-left: 10px;
    padding: 7px 12px;
    border: none;
    border-radius: var(--radius-sm);
    background: var(--teal-100);
    color: var(--teal-900);
    font-family: inherit;
    font-weight: 700;
    font-size: 12.5px;
    cursor: pointer;
}
.p137-box input[type=file]::file-selector-button:hover { background: #d3e9e2; }

/* ---------- Responsive tables: stack into labeled cards under ~600px ---------- */
@media (max-width: 600px) {
    .p137-table--responsive thead { display: none; }
    .p137-table--responsive, .p137-table--responsive tbody, .p137-table--responsive tr, .p137-table--responsive td {
        display: block;
        width: 100%;
    }
    .p137-table--responsive tr {
        margin-bottom: 12px;
        padding: 13px 15px;
        border: 1px solid var(--line-soft);
        border-radius: var(--radius-md);
        background: var(--sand-50);
    }
    .p137-table--responsive tr:hover { background: var(--sand-50); }
    .p137-table--responsive td {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 10px;
        padding: 6px 0;
        border-bottom: none;
        text-align: left;
    }
    .p137-table--responsive td[data-label]:not([data-label=""])::before {
        content: attr(data-label);
        color: var(--ink-faint);
        font-size: 12px;
        font-weight: 700;
        flex-shrink: 0;
    }
    .p137-table--responsive td[data-label=""] { justify-content: flex-end; }
}

/* ---------- Mayor appointment booking (ملاقات با شهردار) ---------- */
.p137-appt-intro { color: var(--ink-soft); font-size: 13px; margin-bottom: 12px; }
.p137-appt-loading { color: var(--ink-faint); }
.p137-appt-day-pills { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.p137-appt-day-btn {
    padding: 9px 14px;
    border-radius: var(--radius-sm);
    border: 1.5px solid var(--line);
    background: var(--surface);
    color: var(--ink-soft);
    font-weight: 600;
    cursor: pointer;
    font-size: 13px;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.p137-appt-day-btn:hover { border-color: var(--teal-500); color: var(--ink); }
.p137-appt-day-btn.active { background: var(--teal-800); color: #fff; border-color: var(--teal-800); }
.p137-appt-slots { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.p137-appt-slot-btn {
    padding: 7px 13px;
    border-radius: var(--radius-sm);
    border: 1.5px solid var(--line);
    background: var(--sand-50);
    color: var(--ink-soft);
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.p137-appt-slot-btn:hover { border-color: var(--teal-500); color: var(--ink); }
.p137-appt-slot-btn.active { background: var(--teal-700); color: #fff; border-color: var(--teal-700); }
.p137-appt-selected {
    font-weight: 700;
    color: var(--teal-900);
    background: var(--teal-50);
    border: 1px solid #cfe8e2;
    padding: 10px 14px;
    border-radius: var(--radius-sm);
    font-variant-numeric: tabular-nums;
}
.p137-appt-mine-title { margin-top: 26px; }

/* ---------- Small-phone tightening (~iPhone SE / small Android widths) ---------- */
@media (max-width: 420px) {
    .p137-auth-head { padding: 28px 18px 20px; }
    .p137-box--auth .p137-tabs,
    .p137-box--hub .p137-tabs { margin-left: 16px; margin-right: 16px; }
    .p137-box--auth .p137-tab,
    .p137-box--hub .p137-tab { padding: 18px 16px 20px; }
    .p137-box--auth #p137-auth-result { margin: 0 16px 18px; }
    .p137-auth-head h2 { font-size: 18px; }
    .p137-table { font-size: 13px; }
    .p137-table th, .p137-table td { padding: 7px; }
}

/* v6.2 Premium identity refresh — Parsian Man */
.p137-box--auth{
  max-width:820px!important;border:1px solid rgba(255,255,255,.72)!important;border-radius:32px!important;
  background:rgba(255,255,255,.94)!important;box-shadow:0 30px 90px rgba(7,45,105,.16)!important;overflow:hidden;
}
.p137-box--auth .p137-auth-head{
  position:relative;overflow:hidden;padding:38px 34px 30px!important;
  /* همان پالت آبی صفحه‌ی ورود پرتال یکپارچه (parsian-portal-suite):
     --pps-primary-1/2/3 = #0a2d57 / #0d7bd6 / #17c2c2 */
  background:radial-gradient(circle at 88% 18%,rgba(242,181,29,.28),transparent 22%),radial-gradient(circle at 8% 100%,rgba(255,255,255,.13),transparent 30%),linear-gradient(135deg,#0a2d57 0%,#0d7bd6 60%,#17c2c2 100%)!important;
}
.p137-box--auth .p137-auth-head:after{content:"";position:absolute;width:230px;height:230px;left:-95px;bottom:-155px;border:1px solid rgba(255,255,255,.12);border-radius:50%;box-shadow:0 0 0 30px rgba(255,255,255,.035),0 0 0 62px rgba(255,255,255,.02)}
.p137-box--auth .p137-auth-badge{position:relative;z-index:1;width:78px;height:78px;border-radius:24px!important;background:linear-gradient(145deg,#fff8dc,#f2bd37)!important;color:#17304f!important;box-shadow:0 16px 34px rgba(0,0,0,.22)!important;font-weight:900}
.p137-box--auth .p137-auth-head h2,.p137-box--auth .p137-auth-head p{position:relative;z-index:1}
.p137-box--auth .p137-auth-head h2{font-size:30px!important;letter-spacing:-.5px}
.p137-box--auth .p137-auth-head p{max-width:580px;line-height:2!important}
.p137-box--auth .p137-tabgroup{padding:0 34px 34px}
.p137-box--auth .p137-tabs{padding:5px!important;border:1px solid #e2eaf6;background:#f5f8fd!important;border-radius:16px!important}
.p137-box--auth .p137-tab-btn{border-radius:12px!important;font-weight:900!important}
.p137-box--auth .p137-tab-btn.active{background:#fff!important;color:#0d7bd6!important;box-shadow:0 8px 22px rgba(10,45,87,.10)!important}
.p137-box--auth .p137-tab label{font-weight:800;color:#314761}
.p137-box--auth .p137-tab input{min-height:50px;border:1px solid #d7e2f0!important;box-shadow:0 5px 16px rgba(10,45,87,.035)!important}
.p137-box--auth .p137-tab input:focus{border-color:#0d7bd6!important;box-shadow:0 0 0 4px rgba(13,123,214,.11)!important}
.p137-box--auth .p137-btn{border-radius:15px!important;padding:15px 18px!important;background:linear-gradient(105deg,#0a2d57,#0d7bd6,#17c2c2)!important;box-shadow:0 15px 30px rgba(10,45,87,.22)!important}

/* بدون position:relative + overflow:hidden، حلقه‌ی تزئینیِ :after (خط زیر)
   نسبت به یک اجداد دورتر جای می‌گرفت (نه خودِ کارت) و عملاً یا نامرئی بود یا
   بیرون از کادر گرد کارت لَنگ می‌ماند — برای همین کارت «خیلی بی‌روح» به‌نظر
   می‌رسید. با این دو خط، هم حلقه داخل کارت درست جا می‌گیرد هم به گوشه‌های
   گرد کارت کلیپ می‌شود. */
.p137-citizen-card{position:relative;overflow:hidden;border-radius:32px!important;padding:26px!important;background:radial-gradient(circle at 91% 7%,rgba(242,181,29,.28),transparent 20%),radial-gradient(circle at 4% 90%,rgba(255,255,255,.08),transparent 28%),linear-gradient(135deg,#061f55 0%,#0759c9 55%,#0c8ee8 100%)!important;box-shadow:0 28px 70px rgba(7,59,135,.24)!important;border:1px solid rgba(255,255,255,.14)}
.p137-citizen-card:before{content:"";position:absolute;inset:0 0 auto 0;height:5px;background:linear-gradient(90deg,#f2b51d,#0d7bd6,#17c2c2);opacity:.9}
.p137-citizen-card:after{content:"";position:absolute;inset:-120px auto auto -120px;width:300px;height:300px;border:1px solid rgba(255,255,255,.1);border-radius:50%;box-shadow:0 0 0 38px rgba(255,255,255,.035),0 0 0 76px rgba(255,255,255,.022);pointer-events:none}
.p137-citizen-card .pm-card-app{font-size:19px;letter-spacing:-.2px}.p137-citizen-card .pm-card-chip{border:1px solid rgba(255,255,255,.13);background:rgba(255,255,255,.10)!important}
.p137-citizen-card .pm-card-field{backdrop-filter:blur(5px);border-color:rgba(255,255,255,.13)!important;background:rgba(255,255,255,.075)!important}
.p137-citizen-card .pm-card-value{letter-spacing:.1px}.p137-citizen-card .pm-card-qr{box-shadow:0 12px 24px rgba(0,0,0,.13)}
@media(max-width:620px){.p137-box--auth .p137-auth-head{padding:30px 20px 24px!important}.p137-box--auth .p137-tabgroup{padding:0 18px 22px}.p137-citizen-card{padding:20px!important;border-radius:26px!important}}

/* =========================================================================
   v4.1 — Clean civic dashboard refresh
   Fixes the overly narrow hub and removes the "stacked mobile card" feel on
   desktop. The hub becomes the page-level shell; inner views stay flat.
   ========================================================================= */

.p137-box--hub{
    --hub-blue:#155eef;
    --hub-navy:#0b3b91;
    --hub-ink:#17223a;
    --hub-muted:#64748b;
    --hub-line:#e3eaf4;
    --hub-bg:#f7f9fc;
    width:min(1120px,calc(100vw - 32px))!important;
    max-width:1120px!important;
    margin:32px auto!important;
    padding:0!important;
    background:var(--hub-bg)!important;
    border:1px solid var(--hub-line)!important;
    border-radius:28px!important;
    overflow:hidden!important;
    box-shadow:0 24px 70px rgba(15,42,82,.12)!important;
}
.p137-box--hub .p137-auth-head{
    padding:30px 36px 28px!important;
    text-align:right!important;
    background:
        radial-gradient(circle at 8% 20%,rgba(255,255,255,.16),transparent 25%),
        linear-gradient(135deg,#0b3b91 0%,#155eef 62%,#2087df 100%)!important;
}
.p137-box--hub .p137-auth-badge{
    width:54px!important;height:54px!important;
    margin:0 0 14px!important;
    border-radius:16px!important;
    background:linear-gradient(145deg,#fff8df,#f2bd37)!important;
    color:#17304f!important;
    box-shadow:0 10px 25px rgba(0,0,0,.16)!important;
    -webkit-mask-image:none!important;
    mask-image:none!important;
}
.p137-box--hub .p137-auth-head h2{
    font-size:27px!important;
    margin-bottom:6px!important;
}
.p137-box--hub .p137-auth-head p{
    max-width:760px;
    font-size:13.5px!important;
    line-height:1.9!important;
}
.p137-box--hub .p137-hub-tabgroup{
    padding:0 24px 30px;
}
.p137-box--hub .p137-tabs{
    display:grid!important;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px!important;
    margin:18px 0 0!important;
    padding:5px!important;
    overflow:visible!important;
    background:#edf2f8!important;
    border:1px solid #e0e7f0!important;
    border-radius:16px!important;
}
.p137-box--hub .p137-tab-btn{
    min-width:0;
    justify-content:center;
    padding:11px 10px!important;
    border:0!important;
    border-radius:11px!important;
    background:transparent!important;
    color:#52627a!important;
    font-size:13px!important;
}
.p137-box--hub .p137-tab-btn:hover:not(.active){
    background:#fff!important;
    color:#1f3f72!important;
    border-color:transparent!important;
}
.p137-box--hub .p137-tab-btn.active{
    background:#fff!important;
    color:#155eef!important;
    border-color:transparent!important;
    box-shadow:0 5px 18px rgba(28,60,108,.10)!important;
}
.p137-box--hub .p137-tab{
    padding:24px 4px 0!important;
}
.p137-box--hub .p137-tab .p137-box{
    background:transparent!important;
}

/* v4.5 — «اصفهان من»: وقتی هاب مستقیماً روی صفحه‌ی خانه‌ی داشبورد باز
   می‌شود (.p137-hub-home، در hub.php برای شهروند واردشده)، دیگر نباید
   خودش یک کارت جدا با پس‌زمینه/حاشیه/سایه باشد — چون dashboard.php از
   قبل هیرو و کارت‌های خودش را دارد و دوتاکارت‌شدن باعث می‌شود چیدمان با
   موکاپ فرق کند. سلکتور دو-کلاسه از .p137-box--hub تنها اختصاصی‌تر است،
   پس با وجود !important در هر دو طرف، همین قانون برنده می‌شود.
   همچنین .p137-tab/.p137-panel داخل آن هیچ پدینگ اضافه‌ای نمی‌گیرند و
   دکمه‌ی «بازگشت به خانه»ی هر پنل فرعی همین‌جا استایل می‌خورد. */
.p137-box--hub.p137-hub-home{
    max-width:1160px!important;
    width:100%!important;
    background:transparent!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    margin:16px auto!important;
}
.p137-box--hub.p137-hub-home .p137-tab{
    padding:0!important;
    animation:none!important;
}
.p137-panel-back{
    display:inline-flex;align-items:center;gap:4px;
    background:#eef2f8;border:1px solid #e2e8f2;color:#0d3b6b;
    font-family:inherit;font-weight:800;font-size:12.5px;
    border-radius:999px;padding:9px 16px;margin:14px 2px 4px;cursor:pointer;
}
.p137-panel-back:hover{ background:#e4eaf4; }

/* Dashboard: use the hub width instead of creating another narrow card. */
.p137-box--hub .p137-citizen-dashboard{
    max-width:none!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
}
.p137-box--hub .p137-dash-list{
    box-shadow:0 8px 28px rgba(23,34,58,.045)!important;
}
.p137-box--hub .p137-dash-logout{
    text-align:left!important;
}
.p137-box--hub .p137-dash-logout-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:42px;
    padding:9px 18px;
    border-radius:12px;
    border:1px solid #f0cfcb;
    background:#fff7f6;
    color:#a33a33;
    text-decoration:none;
    font-size:13px;
    font-weight:800;
    transition:.18s ease;
}
.p137-box--hub .p137-dash-logout-btn:hover{
    background:#ffefed;
    transform:translateY(-1px);
}

/* Citizen card: wide but calmer, so it reads as an account header rather
   than a separate giant card floating above the dashboard. */
.p137-box--hub .p137-citizen-card{
    margin:0 0 4px!important;
    border-radius:22px!important;
    padding:22px!important;
    box-shadow:0 14px 34px rgba(7,59,135,.14)!important;
}
.p137-box--hub .p137-citizen-card .pm-card-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
    margin-top:16px!important;
}
.p137-box--hub .p137-citizen-card .pm-card-field{
    min-width:0;
    border-radius:13px!important;
    padding:10px 12px;
}

/* Form/track/service panels should feel like sections, not cards nested
   inside another card. */
.p137-box--hub .p137-tab > .p137-box{
    padding:0!important;
    border:0!important;
    box-shadow:none!important;
    background:transparent!important;
}

@media(max-width:900px){
    .p137-box--hub .p137-tabs{
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}
@media(max-width:620px){
    .p137-box--hub{
        width:calc(100vw - 16px)!important;
        margin:12px auto!important;
        border-radius:20px!important;
    }
    .p137-box--hub .p137-auth-head{
        padding:24px 20px 22px!important;
    }
    .p137-box--hub .p137-auth-head h2{
        font-size:23px!important;
    }
    .p137-box--hub .p137-hub-tabgroup{
        padding:0 12px 20px;
    }
    .p137-box--hub .p137-tabs{
        display:flex!important;
        overflow-x:auto!important;
        justify-content:flex-start;
        margin-top:12px!important;
    }
    .p137-box--hub .p137-tab-btn{
        flex:0 0 auto!important;
        white-space:nowrap;
    }
    .p137-box--hub .p137-tab{
        padding:18px 0 0!important;
    }
    .p137-box--hub .p137-citizen-card{
        border-radius:18px!important;
    }
    .p137-box--hub .p137-citizen-card .pm-card-grid{
        grid-template-columns:1fr!important;
    }
}

/* ---------- 4.9.0 smart mayor-meeting calendar ---------- */
.p137-appt-hero{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 20px;margin:-4px -4px 18px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(135deg,var(--teal-50),#fff)}
.p137-appt-hero h3{margin:4px 0 5px;font-size:21px}.p137-appt-hero p{margin:0;color:var(--ink-soft);font-size:13px}.p137-appt-kicker{font-size:11px;font-weight:800;color:var(--teal-700)}
.p137-appt-hero-icon{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;background:var(--teal-800);color:#fff;font-size:28px;box-shadow:0 10px 25px rgba(0,0,0,.08)}
.p137-appt-calendar-head{display:flex;justify-content:space-between;gap:12px;align-items:center;margin:18px 0 10px}.p137-appt-calendar-head span,.p137-appt-slot-title span{font-size:11px;color:var(--ink-faint)}
.p137-appt-day-pills{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:9px;margin-bottom:16px}
.p137-appt-day-btn{display:flex;flex-direction:column;align-items:flex-start;gap:3px;text-align:right;padding:12px 13px;border-radius:14px;border:1.5px solid var(--line);background:var(--surface);color:var(--ink-soft);cursor:pointer;font-size:12px;transition:.15s ease}
.p137-appt-day-btn:hover{border-color:var(--teal-500);transform:translateY(-1px)}.p137-appt-day-btn.active{background:var(--teal-800);color:#fff;border-color:var(--teal-800);box-shadow:0 8px 18px rgba(13,84,87,.15)}
.p137-appt-day-date{font-size:14px;font-weight:800}.p137-appt-day-name{font-weight:700}.p137-appt-day-free{font-size:10px;opacity:.72}
.p137-appt-slot-title{display:flex;justify-content:space-between;align-items:center;margin:6px 0 9px}.p137-appt-slots{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:8px;margin-bottom:12px}
.p137-appt-slot-btn{min-height:55px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:2px;padding:7px 10px;border-radius:12px;border:1.5px solid var(--line);background:var(--sand-50);color:var(--ink-soft);cursor:pointer;font-size:13px;font-weight:800;transition:.15s ease}
.p137-appt-slot-btn small{font-size:9px;font-weight:600;color:var(--ink-faint)}.p137-appt-slot-btn:hover{border-color:var(--teal-500);color:var(--ink);transform:translateY(-1px)}.p137-appt-slot-btn.active{background:var(--teal-700);color:#fff;border-color:var(--teal-700)}.p137-appt-slot-btn.active small{color:rgba(255,255,255,.78)}
.p137-appt-slot-btn.is-full{background:#fff4f2;border-color:#f0c9c4;color:#9c4037}.p137-appt-slot-btn.is-full small{color:#ae3b34}.p137-appt-slot-btn.is-full:hover{border-color:#ae3b34}
.p137-appt-selected small{display:block;margin-top:5px;color:var(--ink-soft);font-weight:500}.p137-appt-ticket{margin-top:18px;border:1px solid var(--line);border-radius:18px;padding:17px;background:#fff;box-shadow:0 12px 30px rgba(0,0,0,.07)}
.p137-appt-ticket-head,.p137-appt-ticket-body{display:flex;justify-content:space-between;gap:14px;align-items:center}.p137-appt-ticket-head{padding-bottom:12px;border-bottom:1px dashed var(--line)}.p137-appt-ticket-head div{display:flex;flex-direction:column;gap:3px}.p137-appt-ticket-head span:first-child{font-size:11px;color:var(--ink-faint)}.p137-appt-ticket-head strong{font-size:17px}.p137-appt-ticket-body{padding:15px 0}.p137-appt-ticket-body>div:not(.p137-appt-ticket-qr){display:flex;flex-direction:column;gap:4px}.p137-appt-ticket-body small{font-size:10px;color:var(--ink-faint)}.p137-appt-ticket-body strong{font-size:14px}.p137-appt-ticket-qr{width:110px;height:110px;flex:0 0 110px}.p137-appt-ticket-qr svg{width:100%;height:100%}.p137-appt-ticket p{font-size:11px;color:var(--ink-soft);margin:0 0 10px}
.p137-appt-list{display:grid;gap:10px}.p137-appt-my-card{position:relative;display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;padding:14px;border:1px solid var(--line);border-radius:16px;background:var(--surface);overflow:hidden}.p137-appt-code{font-weight:900;letter-spacing:.4px;color:var(--teal-800)}.p137-appt-my-date,.p137-appt-my-time{margin-top:4px;font-weight:700}.p137-appt-my-subject{margin:8px 0;color:var(--ink-soft);font-size:12px}.p137-appt-my-qr{width:86px;height:86px}.p137-appt-my-qr svg{width:100%;height:100%}.p137-appt-my-card .p137-appt-cancel-btn{grid-column:1/-1;justify-self:start}
@media print{body *{visibility:hidden!important}.p137-appt-ticket,.p137-appt-ticket *{visibility:visible!important}.p137-appt-ticket{position:absolute;left:0;top:0;width:100%;box-shadow:none;border:1px solid #222}}
@media(max-width:600px){.p137-appt-hero{padding:15px}.p137-appt-hero h3{font-size:18px}.p137-appt-hero-icon{width:48px;height:48px;font-size:23px}.p137-appt-calendar-head,.p137-appt-slot-title{align-items:flex-start;flex-direction:column}.p137-appt-day-pills{grid-template-columns:repeat(2,1fr)}.p137-appt-slot-btn{min-height:52px}.p137-appt-ticket-body{flex-wrap:wrap}.p137-appt-ticket-qr{margin-right:auto}}
/* نوبت‌دهی 4.9.3 — وضعیت تقویم و بروزرسانی */
.p137-appt-calendar-head>div{display:flex;flex-direction:column;gap:3px}.p137-appt-refresh{white-space:nowrap}.p137-appt-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:24px 16px;margin:8px 0 16px;border:1px dashed var(--line);border-radius:14px;background:var(--sand-50);text-align:center;color:var(--ink-soft)}.p137-appt-empty strong{font-size:14px;color:var(--ink)}.p137-appt-empty span{font-size:12px;color:var(--ink-faint)}.p137-appt-day-btn.is-full-day{border-color:#e9c7c3}.p137-appt-day-btn.is-full-day .p137-appt-day-free{color:#ae3b34}.p137-appt-loading{text-align:center;padding:24px;color:var(--ink-faint)}

/* =========================================================================
   v4.11 — پرونده یکپارچه + اپ نصب‌شونده
   ========================================================================= */
.p137-myfile{max-width:760px;margin:0 auto;font-family:Vazirmatn,Tahoma,sans-serif;color:#17231f}
.p137-myfile-hero{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:24px;border-radius:22px;background:linear-gradient(135deg,#0a4547,#187f7c);color:#fff;box-shadow:0 18px 45px rgba(10,69,71,.2)}
.p137-myfile-kicker{font-size:11px;opacity:.75}.p137-myfile-hero h3{margin:5px 0;font-size:23px;color:#fff}.p137-myfile-hero p{margin:0;color:rgba(255,255,255,.75);font-size:12px}.p137-myfile-seal{width:64px;height:64px;border-radius:20px;display:grid;place-items:center;background:#f2e7cd;color:#0a4547;font-weight:900;font-size:22px;box-shadow:0 10px 25px rgba(0,0,0,.15)}
.p137-myfile-next{margin-top:14px;display:flex;align-items:center;gap:12px;padding:15px;border:1px solid #dfe9e5;border-radius:18px;background:#f3faf7}.p137-myfile-next-icon{width:44px;height:44px;border-radius:14px;background:#dcefe9;display:grid;place-items:center;font-size:20px}.p137-myfile-next small,.p137-myfile-next strong,.p137-myfile-next span{display:block}.p137-myfile-next small{font-size:10px;color:#658078}.p137-myfile-next strong{font-size:14px;color:#0a4547}.p137-myfile-next span{font-size:11px;color:#61736d}.p137-myfile-next .p137-btn-ghost{margin-right:auto;white-space:nowrap}
.p137-myfile-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}.p137-myfile-stat{padding:16px;border:1px solid #e5ece9;border-radius:16px;background:#fff;text-align:center}.p137-myfile-stat strong{display:block;font-size:21px;color:#0a4547}.p137-myfile-stat span{font-size:10px;color:#6c7d76}
.p137-myfile-section{margin-top:16px;border:1px solid #e5ece9;border-radius:20px;background:#fff;overflow:hidden}.p137-myfile-title{display:flex;justify-content:space-between;padding:16px 18px;border-bottom:1px solid #edf2ef}.p137-myfile-title strong{font-size:14px}.p137-myfile-title span{font-size:10px;color:#81908b}.p137-myfile-empty{text-align:center;padding:30px;color:#74847e;font-size:12px}.p137-myfile-event{display:flex;gap:12px;padding:13px 16px;border-bottom:1px solid #f0f3f1}.p137-myfile-event:last-child{border-bottom:0}.p137-myfile-event-icon{width:38px;height:38px;border-radius:12px;background:#f0f7f5;display:grid;place-items:center}.p137-myfile-event-main strong,.p137-myfile-event-main span,.p137-myfile-event-main small{display:block}.p137-myfile-event-main strong{font-size:12px}.p137-myfile-event-main span{font-size:10.5px;color:#60736c}.p137-myfile-event-main small{font-size:9.5px;color:#9aa7a2;margin-top:2px}.p137-myfile-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:16px}.p137-myfile-action{border:1px solid #e5ece9;background:#fff;border-radius:16px;padding:15px 9px;text-align:center;cursor:pointer;font-family:inherit}.p137-myfile-action span,.p137-myfile-action b,.p137-myfile-action small{display:block}.p137-myfile-action span{font-size:21px}.p137-myfile-action b{font-size:11px;margin-top:6px}.p137-myfile-action small{font-size:9px;color:#7b8b85;margin-top:3px}
@media(max-width:650px){.p137-myfile-grid{grid-template-columns:repeat(3,1fr)}.p137-myfile-actions{grid-template-columns:repeat(2,1fr)}.p137-myfile-next{align-items:flex-start;flex-wrap:wrap}.p137-myfile-next .p137-btn-ghost{margin-right:0;width:100%}}