@charset "UTF-8";
@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css");

@import url("https://fonts.googleapis.com/css2?family=Sarabun:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=swap");

/**
 * FILE: /public/assets/css/style.css
 * Project: Hahongpak.com / หาห้องพัก
 * Theme: Clean Blue + White Real Estate UI
 */

/* ============================================================
   CSS Variables
============================================================ */

:root {
    --primary: #0ea5e9;
    --primary-dark: #0284c7;
    --primary-soft: #e0f2fe;
    --primary-light: #f0f9ff;

    --secondary: #2563eb;
    --success: #16a34a;
    --warning: #f59e0b;
    --danger: #dc2626;
    --info: #0891b2;

    --text: #0f172a;
    --text-soft: #475569;
    --text-muted: #64748b;

    --bg: #f8fafc;
    --bg-soft: #f1f5f9;
    --white: #ffffff;

    --border: #e2e8f0;
    --border-soft: #edf2f7;

    --shadow-sm: 0 4px 14px rgba(15, 23, 42, 0.06);
    --shadow: 0 14px 35px rgba(15, 23, 42, 0.09);
    --shadow-lg: 0 24px 60px rgba(15, 23, 42, 0.16);

    --radius-sm: 10px;
    --radius: 16px;
    --radius-lg: 24px;
    --radius-xl: 32px;

    --container: 1180px;

    --font: "Sarabun", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Tahoma, sans-serif;
}

/* Admin navigation drawer for mobile and tablet. */
.admin-mobile-header,
.admin-sidebar-backdrop,
.admin-sidebar-close {
    display: none;
}

@media (max-width: 900px) {
    .admin-mobile-header {
        position: sticky;
        top: 0;
        z-index: 1100;
        display: flex;
        min-height: 72px;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        padding: 10px 16px;
        background: #0f172a;
        box-shadow: 0 8px 24px rgba(15, 23, 42, 0.2);
    }

    .admin-mobile-brand {
        display: flex;
        min-width: 0;
        align-items: center;
        gap: 11px;
        color: #ffffff;
    }

    .admin-mobile-brand .logo-mark {
        width: 44px;
        height: 44px;
        flex: 0 0 44px;
    }

    .admin-mobile-brand strong,
    .admin-mobile-brand small {
        display: block;
        line-height: 1.35;
    }

    .admin-mobile-brand small {
        color: #cbd5e1;
        font-size: 12px;
    }

    .admin-menu-toggle,
    .admin-sidebar-close {
        width: 44px;
        height: 44px;
        align-items: center;
        justify-content: center;
        flex: 0 0 44px;
        border: 1px solid rgba(255, 255, 255, 0.18);
        border-radius: 12px;
        background: rgba(255, 255, 255, 0.1);
        color: #ffffff;
        font-size: 20px;
        cursor: pointer;
    }

    .admin-menu-toggle {
        display: inline-flex;
    }

    .admin-sidebar {
        position: fixed !important;
        inset: 0 auto 0 0 !important;
        z-index: 1200;
        width: min(86vw, 340px) !important;
        height: 100dvh !important;
        min-height: 100vh !important;
        padding: 20px 16px !important;
        overflow-x: hidden;
        overflow-y: auto;
        transform: translateX(-105%);
        transition: transform 0.25s ease;
        box-shadow: 16px 0 40px rgba(2, 6, 23, 0.32);
        visibility: hidden;
    }

    .admin-sidebar-open .admin-sidebar {
        transform: translateX(0);
        visibility: visible;
    }

    .admin-sidebar-close {
        position: absolute;
        top: 18px;
        right: 14px;
        display: inline-flex;
    }

    .admin-sidebar .admin-brand {
        margin-right: 54px;
        margin-bottom: 22px;
    }

    .admin-sidebar .admin-nav {
        display: grid !important;
        gap: 6px;
        padding: 0 0 18px;
        overflow: visible;
    }

    .admin-sidebar .admin-nav a {
        width: 100%;
        white-space: normal;
        padding: 10px 12px !important;
    }

    .admin-sidebar .admin-nav-group {
        width: 100%;
    }

    .admin-sidebar-backdrop {
        position: fixed;
        inset: 0;
        z-index: 1150;
        width: 100%;
        height: 100%;
        border: 0;
        background: rgba(2, 6, 23, 0.56);
        opacity: 0;
        visibility: hidden;
        transition: opacity 0.25s ease, visibility 0.25s ease;
        cursor: default;
    }

    .admin-sidebar-open .admin-sidebar-backdrop {
        display: block;
        opacity: 1;
        visibility: visible;
    }

    body.admin-sidebar-open {
        overflow: hidden;
    }
}

/* Featured properties admin */
body.featured-admin-page.modal-open{overflow:hidden}
.featured-admin-page .admin-topbar{margin-bottom:22px}
.featured-admin-page .admin-topbar .btn{gap:8px;border-radius:10px!important}
.featured-filter-card{padding:18px 20px!important;border-radius:16px!important}
.featured-filter-grid{display:grid;grid-template-columns:minmax(280px,1fr) minmax(180px,.3fr) auto;gap:12px;align-items:end}
.featured-filter-grid .form-group{margin:0}
.featured-filter-actions{display:flex;align-items:flex-end;gap:8px}
.featured-filter-actions>label{display:none}
.featured-filter-actions .btn{min-height:44px;white-space:nowrap}
.featured-table-card{border-radius:16px;overflow:hidden}
.featured-table{min-width:900px}
.featured-table th{font-size:12px;color:#52657a;background:#f8fafc}
.featured-table td{vertical-align:middle}
.featured-listing-cell{display:flex;align-items:center;gap:12px;min-width:260px}
.featured-listing-cell img{width:72px;height:56px;flex:0 0 72px;object-fit:cover;border-radius:10px;background:#f1f5f9}
.featured-listing-cell strong{display:block;color:#1e293b;line-height:1.35}
.featured-listing-cell small{display:block;line-height:1.45}
.featured-slug{color:#8493a5}
.featured-date-separator{display:block;color:#94a3b8;font-size:12px;line-height:1}
.featured-order{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:9px;background:#eff6ff;color:#1d4ed8;font-weight:900}
.featured-toggle-form{display:inline-flex;margin:0}
.featured-inline-switch{position:relative;width:42px;height:24px;padding:0;border:0;border-radius:999px;background:#cbd5e1;cursor:pointer;transition:.2s}
.featured-inline-switch span{position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(15,23,42,.24);transition:.2s}
.featured-inline-switch.is-active{background:linear-gradient(135deg,#0ea5e9,#2563eb)}
.featured-inline-switch.is-active span{transform:translateX(18px)}
.featured-icon-actions{display:flex;gap:7px;flex-wrap:nowrap}
.featured-icon-actions form{margin:0}
.featured-icon-button{display:inline-grid;place-items:center;width:36px;height:36px;padding:0;border:1px solid #dbe6f2;border-radius:9px;background:#fff;color:#0877d1;cursor:pointer;text-decoration:none;transition:.18s}
.featured-icon-button:hover{border-color:#93c5fd;background:#eff6ff;transform:translateY(-1px)}
.featured-icon-button.is-danger{color:#dc2626;border-color:#fecaca}
.featured-icon-button.is-danger:hover{background:#fef2f2;border-color:#fca5a5}
.badge-info{background:#dbeafe;color:#1d4ed8}
.featured-modal[hidden]{display:none}
.featured-modal{position:fixed;inset:0;z-index:2100;display:grid;place-items:center;padding:20px}
.featured-modal-backdrop{position:absolute;inset:0;width:100%;height:100%;border:0;background:rgba(15,23,42,.62);backdrop-filter:blur(4px);cursor:default}
.featured-modal-dialog{position:relative;width:min(930px,100%);max-height:92vh;overflow:auto;border-radius:20px;box-shadow:0 30px 90px rgba(15,23,42,.35)}
.featured-modal-card{position:relative;margin:0!important;padding:28px!important;border:0!important;border-radius:20px!important}
.featured-modal-close{position:absolute;top:18px;right:18px;z-index:2;width:38px;height:38px;border:0;border-radius:50%;background:#f1f5f9;color:#475569;cursor:pointer;font-size:18px}
.featured-modal-card .section-header{padding-right:42px;margin-bottom:22px}
.featured-modal-card .section-title{margin-bottom:4px}
.featured-modal-form{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(280px,.92fr);gap:22px 18px}
.featured-form-fields{display:grid;gap:15px}
.featured-form-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.featured-form-fields .form-group{margin:0}
.featured-switch-card{display:flex!important;align-items:center;gap:10px;min-height:48px;padding:8px 10px;border:1px solid #dbe6f2;border-radius:10px;background:#f8fbff;cursor:pointer}
.featured-switch-card>input{position:absolute;opacity:0}
.featured-switch-ui{position:relative;width:42px;height:24px;flex:0 0 42px;border-radius:999px;background:#cbd5e1;transition:.2s}
.featured-switch-ui:after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(15,23,42,.22);transition:.2s}
.featured-switch-card input:checked+.featured-switch-ui{background:linear-gradient(135deg,#0ea5e9,#2563eb)}
.featured-switch-card input:checked+.featured-switch-ui:after{transform:translateX(18px)}
.featured-switch-card strong,.featured-switch-card small{display:block}
.featured-switch-card small{margin-top:1px;color:#64748b;font-size:11px;font-weight:500}
.featured-property-preview{min-height:300px;padding:20px;border:1px solid #dbeafe;border-radius:16px;background:linear-gradient(145deg,#f8fbff,#eff6ff)}
.featured-preview-empty{height:100%;min-height:258px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;color:#71839a}
.featured-preview-empty i{font-size:30px;color:#60a5fa}
.featured-preview-empty strong{color:#1d4ed8}
.featured-preview-card h3{margin:14px 0 4px;font-size:18px;color:#1e3a5f}
.featured-preview-card>img{width:100%;height:150px;object-fit:cover;border-radius:12px;background:#e2e8f0}
.featured-preview-card p{margin:0 0 13px;color:#64748b;font-size:13px}
.featured-preview-meta{display:grid;gap:9px;padding-top:13px;border-top:1px solid #dbeafe;color:#40566f;font-size:13px}
.featured-preview-meta span{display:flex;gap:9px;align-items:flex-start}
.featured-preview-meta i{width:16px;margin-top:2px;color:#1684df;text-align:center}
.featured-modal-actions{grid-column:1/-1;display:flex;justify-content:flex-end;gap:10px;padding-top:16px;border-top:1px solid #e5edf5}
.featured-modal-actions .btn{min-width:105px;justify-content:center;gap:7px}

@media(max-width:900px){
    .featured-filter-grid{grid-template-columns:1fr 190px}
    .featured-filter-actions{grid-column:1/-1}
    .featured-modal-form{grid-template-columns:1fr}
    .featured-property-preview{min-height:0}
    .featured-preview-empty{min-height:150px}
    .featured-modal-actions{grid-column:1}
}
@media(max-width:640px){
    .featured-filter-grid{grid-template-columns:1fr}
    .featured-filter-actions{grid-column:1}
    .featured-filter-actions .btn{flex:1;justify-content:center}
    .featured-modal{padding:8px}
    .featured-modal-dialog{max-height:96vh;border-radius:16px}
    .featured-modal-card{padding:20px 16px!important}
    .featured-form-row{grid-template-columns:1fr}
    .featured-modal-actions{position:sticky;bottom:-20px;margin:0 -16px -20px;padding:14px 16px;background:#fff}
    .featured-modal-actions .btn{flex:1}
}

@media (prefers-reduced-motion: reduce) {
    .admin-sidebar,
    .admin-sidebar-backdrop {
        transition: none;
    }
}

/* ============================================================
   Reset
============================================================ */

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    font-family: var(--font);
    color: var(--text);
    background: var(--bg);
    line-height: 1.65;
    font-size: 15px;
}

a {
    color: inherit;
    text-decoration: none;
}

a:hover {
    color: var(--primary-dark);
}

img {
    max-width: 100%;
    display: block;
}

button,
input,
select,
textarea {
    font-family: inherit;
}

button {
    cursor: pointer;
}

textarea {
    resize: vertical;
}

.container {
    width: min(var(--container), calc(100% - 32px));
    margin: 0 auto;
}

.site-main {
    min-height: 60vh;
}

/* ============================================================
   Utilities
============================================================ */

.section {
    padding: 56px 0;
}

.section-sm {
    padding: 32px 0;
}

.section-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 24px;
}

.section-title {
    margin: 0;
    font-size: clamp(24px, 3vw, 34px);
    line-height: 1.25;
    letter-spacing: -0.03em;
}

.section-subtitle {
    margin: 8px 0 0;
    color: var(--text-muted);
}

.text-muted {
    color: var(--text-muted);
}

.text-primary {
    color: var(--primary-dark);
}

.text-center {
    text-align: center;
}

.hidden {
    display: none !important;
}

.mt-0 {
    margin-top: 0 !important;
}

.mb-0 {
    margin-bottom: 0 !important;
}

.mt-16 {
    margin-top: 16px !important;
}

.mt-24 {
    margin-top: 24px !important;
}

.mb-16 {
    margin-bottom: 16px !important;
}

.mb-24 {
    margin-bottom: 24px !important;
}

/* ============================================================
   Header
============================================================ */

.site-header {
    background: var(--white);
    border-bottom: 1px solid var(--border);
    position: sticky;
    top: 0;
    z-index: 100;
}

.top-strip {
    background: linear-gradient(90deg, #0284c7, #0ea5e9);
    color: #ffffff;
    font-size: 13px;
}

.top-strip-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 38px;
}

.top-strip-right {
    display: flex;
    align-items: center;
    gap: 14px;
    white-space: nowrap;
}

.top-strip a {
    color: #ffffff;
    opacity: 0.95;
}

.top-strip a:hover {
    color: #ffffff;
    opacity: 1;
    text-decoration: underline;
}

.main-header {
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(16px);
}

.main-header-inner {
    min-height: 76px;
    display: flex;
    align-items: center;
    gap: 22px;
}

.site-logo,
.footer-logo {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.site-logo img,
.footer-logo img {
    width: 46px;
    height: 46px;
    object-fit: contain;
}

.logo-mark {
    width: 46px;
    height: 46px;
    border-radius: 16px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, var(--primary), var(--secondary));
    color: #ffffff;
    font-weight: 900;
    font-size: 24px;
    box-shadow: 0 10px 25px rgba(14, 165, 233, 0.3);
}

.logo-text {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
}

.logo-text strong,
.footer-logo strong {
    font-size: 20px;
    letter-spacing: -0.02em;
    color: var(--text);
}

.logo-text small,
.footer-logo small {
    color: var(--text-muted);
    font-size: 13px;
}

.main-nav {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-left: auto;
}

.main-nav a {
    padding: 10px 12px;
    border-radius: 999px;
    color: var(--text-soft);
    font-weight: 600;
    font-size: 14px;
}

.main-nav a:hover,
.main-nav a.active {
    color: var(--primary-dark);
    background: var(--primary-light);
}

.header-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.header-actions .header-auth-button {
    border-radius: 9px;
}

.nav-toggle {
    display: none;
    width: 44px;
    height: 44px;
    border: 1px solid var(--border);
    background: var(--white);
    border-radius: 14px;
    padding: 10px;
}

.nav-toggle span {
    display: block;
    height: 2px;
    background: var(--text);
    border-radius: 999px;
    margin: 5px 0;
}

.user-menu {
    position: relative;
}

.user-menu-button {
    display: flex;
    align-items: center;
    gap: 8px;
    border: 1px solid var(--border);
    background: var(--white);
    border-radius: 999px;
    padding: 6px 10px 6px 6px;
    color: var(--text);
}

.user-avatar {
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    display: grid;
    place-items: center;
    overflow: hidden;
    background: var(--primary-soft);
    color: var(--primary-dark);
    border-radius: 50%;
    font-weight: 800;
}

.user-avatar-image {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    border-radius: inherit;
}

.user-name {
    max-width: 130px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.user-dropdown {
    position: absolute;
    top: calc(100% + 12px);
    right: 0;
    width: 220px;
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    padding: 8px;
    display: none;
}

.user-dropdown.open {
    display: block;
}

.user-dropdown a {
    display: block;
    padding: 10px 12px;
    border-radius: 10px;
    color: var(--text-soft);
    font-weight: 600;
}

.user-dropdown a:hover {
    background: var(--primary-light);
    color: var(--primary-dark);
}

/* ============================================================
   Buttons
============================================================ */

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid transparent;
    border-radius: 999px;
    padding: 12px 18px;
    font-weight: 800;
    line-height: 1.2;
    transition: 0.2s ease;
    cursor: pointer;
    text-align: center;
    min-height: 44px;
}

.btn:hover {
    transform: translateY(-1px);
}

.btn-primary {
    background: linear-gradient(135deg, var(--primary), var(--secondary));
    color: #ffffff;
    box-shadow: 0 12px 24px rgba(14, 165, 233, 0.26);
}

.btn-primary:hover {
    color: #ffffff;
    box-shadow: 0 16px 32px rgba(14, 165, 233, 0.34);
}

.btn-secondary {
    background: var(--primary-soft);
    color: var(--primary-dark);
    border-color: #bae6fd;
}

.btn-secondary:hover {
    background: #bae6fd;
    color: var(--primary-dark);
}

.btn-ghost {
    background: var(--white);
    color: var(--text-soft);
    border-color: var(--border);
}

.btn-ghost:hover {
    background: var(--bg-soft);
    color: var(--text);
}

.btn-danger {
    background: var(--danger);
    color: #ffffff;
}

.btn-danger:hover {
    color: #ffffff;
    background: #b91c1c;
}

.btn-sm {
    padding: 9px 14px;
    font-size: 13px;
    min-height: 38px;
}

.btn-lg {
    padding: 15px 24px;
    font-size: 16px;
    min-height: 52px;
}

.btn-block {
    width: 100%;
}

/* ============================================================
   Forms
============================================================ */

.form-card,
.card,
.panel {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
}

.form-card {
    padding: 28px;
}

.form-grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 16px;
}

.form-group {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.form-group label {
    font-weight: 800;
    color: var(--text);
}

.form-help {
    color: var(--text-muted);
    font-size: 13px;
}

.input,
.select,
.textarea,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="date"],
input[type="datetime-local"],
input[type="url"],
input[type="tel"],
select,
textarea {
    width: 100%;
    border: 1px solid var(--border);
    background: var(--white);
    color: var(--text);
    border-radius: 14px;
    padding: 12px 14px;
    font-size: 15px;
    outline: none;
    transition: 0.2s ease;
}

textarea,
.textarea {
    min-height: 120px;
}

.input:focus,
.select:focus,
.textarea:focus,
input:focus,
select:focus,
textarea:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 4px rgba(14, 165, 233, 0.12);
}

.checkbox-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
}

.checkbox-card {
    display: flex;
    align-items: center;
    gap: 8px;
    background: var(--bg);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 10px 12px;
    cursor: pointer;
}

.checkbox-card:hover {
    background: var(--primary-light);
    border-color: #bae6fd;
}

.checkbox-card input {
    width: auto;
}

.col-12 {
    grid-column: span 12;
}

.col-11 {
    grid-column: span 11;
}

.col-10 {
    grid-column: span 10;
}

.col-9 {
    grid-column: span 9;
}

.col-8 {
    grid-column: span 8;
}

.col-7 {
    grid-column: span 7;
}

.col-6 {
    grid-column: span 6;
}

.col-5 {
    grid-column: span 5;
}

.col-4 {
    grid-column: span 4;
}

.col-3 {
    grid-column: span 3;
}

.col-2 {
    grid-column: span 2;
}

.col-1 {
    grid-column: span 1;
}

/* ============================================================
   Flash Messages
============================================================ */

.flash-wrap {
    width: min(var(--container), calc(100% - 32px));
    margin: 18px auto 0;
}

.flash {
    padding: 14px 16px;
    border-radius: 16px;
    border: 1px solid var(--border);
    margin-bottom: 10px;
    font-weight: 700;
}

.flash-success {
    background: #dcfce7;
    color: #166534;
    border-color: #bbf7d0;
}

.flash-danger {
    background: #fee2e2;
    color: #991b1b;
    border-color: #fecaca;
}

.flash-warning {
    background: #fef3c7;
    color: #92400e;
    border-color: #fde68a;
}

.flash-info {
    background: #e0f2fe;
    color: #075985;
    border-color: #bae6fd;
}

/* ============================================================
   Hero
============================================================ */

.hero {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 12% 10%, rgba(14, 165, 233, 0.22), transparent 28%),
        radial-gradient(circle at 88% 12%, rgba(37, 99, 235, 0.18), transparent 30%),
        linear-gradient(180deg, #ffffff 0%, #eff6ff 100%);
    padding: 54px 0 70px;
}

.hero-inner {
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    gap: 36px;
    align-items: center;
}

.hero-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--primary-dark);
    background: var(--primary-soft);
    border: 1px solid #bae6fd;
    padding: 8px 14px;
    border-radius: 999px;
    font-weight: 800;
    margin-bottom: 16px;
}

.hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 58px);
    line-height: 1.08;
    letter-spacing: -0.05em;
}

.hero h1 span {
    color: var(--primary-dark);
}

.hero p {
    color: var(--text-soft);
    font-size: 17px;
    margin: 18px 0 26px;
}

.hero-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.stat-card {
    background: rgba(255, 255, 255, 0.8);
    border: 1px solid var(--border);
    border-radius: 20px;
    padding: 16px;
    box-shadow: var(--shadow-sm);
}

.stat-card strong {
    display: block;
    font-size: 24px;
    color: var(--primary-dark);
    line-height: 1;
}

.stat-card span {
    color: var(--text-muted);
    font-size: 13px;
}

.hero-visual {
    position: relative;
}

.hero-card {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-lg);
    padding: 18px;
}

.hero-card-image {
    height: 260px;
    border-radius: 24px;
    background:
        linear-gradient(135deg, rgba(14, 165, 233, 0.25), rgba(37, 99, 235, 0.12)),
        url("../images/hero-room.svg");
    background-size: cover;
    background-position: center;
}

.hero-card-info {
    padding: 18px 4px 4px;
}

.hero-card-info h3 {
    margin: 0 0 6px;
    font-size: 22px;
}

.hero-card-info p {
    margin: 0 0 14px;
    color: var(--text-muted);
}

.hero-floating {
    position: absolute;
    right: -10px;
    bottom: 35px;
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 22px;
    box-shadow: var(--shadow);
    padding: 16px;
    min-width: 210px;
}

.hero-floating strong {
    display: block;
    color: var(--success);
    font-size: 22px;
}

.hero-floating span {
    color: var(--text-muted);
}

/* ============================================================
   Search Box
============================================================ */

.search-box {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow);
    padding: 22px;
}

.search-box-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
}

.search-box-title h2 {
    margin: 0;
    font-size: 22px;
}

.search-grid {
    display: grid;
    grid-template-columns: 1.1fr 1.1fr 1.4fr 1fr 1fr auto;
    gap: 12px;
    align-items: end;
}

.search-field label {
    display: block;
    font-weight: 800;
    margin-bottom: 7px;
    color: var(--text);
    font-size: 14px;
}

/* ============================================================
   Property Cards
============================================================ */

.property-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}

.property-card {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 24px;
    box-shadow: var(--shadow-sm);
    overflow: hidden;
    transition: 0.2s ease;
    position: relative;
}

.property-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow);
    border-color: #bae6fd;
}

.property-card-image {
    position: relative;
    display: block;
    height: 210px;
    background: var(--bg-soft);
    overflow: hidden;
}

.property-card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: 0.35s ease;
}

.property-card:hover .property-card-image img {
    transform: scale(1.05);
}

.property-card-body {
    padding: 18px;
}

.property-type {
    color: var(--primary-dark);
    font-weight: 900;
    font-size: 13px;
    margin-bottom: 7px;
}

.property-card h3 {
    margin: 0 0 8px;
    font-size: 19px;
    line-height: 1.35;
}

.property-card h3 a {
    color: var(--text);
}

.property-card h3 a:hover {
    color: var(--primary-dark);
}

.property-location {
    margin: 0 0 12px;
    color: var(--text-muted);
    min-height: 24px;
}

.property-price {
    color: var(--primary-dark);
    font-size: 20px;
    font-weight: 900;
    margin-bottom: 14px;
}

.property-badges {
    position: absolute;
    left: 12px;
    top: 12px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    z-index: 2;
}

.badge {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 5px 9px;
    font-size: 12px;
    font-weight: 900;
    line-height: 1;
}

.badge-success {
    background: #dcfce7;
    color: #166534;
}

.badge-info {
    background: #cffafe;
    color: #155e75;
}

.badge-warning {
    background: #fef3c7;
    color: #92400e;
}

.badge-danger {
    background: #fee2e2;
    color: #991b1b;
}

.badge-muted,
.badge-neutral {
    background: var(--bg-soft);
    color: var(--text-muted);
}

.featured-ribbon {
    position: absolute;
    right: 12px;
    top: 12px;
    z-index: 3;
    background: linear-gradient(135deg, #f59e0b, #f97316);
    color: #ffffff;
    padding: 7px 11px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 900;
    box-shadow: 0 10px 22px rgba(249, 115, 22, 0.28);
}

/* ============================================================
   Listings Page
============================================================ */

.page-hero {
    background:
        radial-gradient(circle at top left, rgba(14, 165, 233, 0.22), transparent 28%),
        linear-gradient(180deg, #ffffff, #eff6ff);
    padding: 44px 0;
    border-bottom: 1px solid var(--border);
}

.page-hero h1 {
    margin: 0;
    font-size: clamp(30px, 4vw, 44px);
    letter-spacing: -0.04em;
    line-height: 1.15;
}

.page-hero p {
    color: var(--text-soft);
    margin: 12px 0 0;
    font-size: 16px;
}

.listing-layout {
    display: grid;
    grid-template-columns: 300px 1fr;
    gap: 22px;
    align-items: start;
}

.filter-sidebar {
    position: sticky;
    top: 112px;
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    padding: 18px;
}

.filter-sidebar h2 {
    margin: 0 0 16px;
    font-size: 20px;
}

.filter-group {
    margin-bottom: 14px;
}

.filter-group label {
    display: block;
    font-weight: 800;
    margin-bottom: 7px;
}

.filter-actions {
    display: grid;
    gap: 10px;
    margin-top: 18px;
}

.listing-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 18px;
    padding: 12px 14px;
}

.listing-toolbar strong {
    color: var(--primary-dark);
}

.sort-box {
    display: flex;
    align-items: center;
    gap: 10px;
}

.sort-box select {
    min-width: 190px;
}

.no-result {
    background: var(--white);
    border: 1px dashed #bae6fd;
    border-radius: var(--radius-lg);
    padding: 36px;
    text-align: center;
    color: var(--text-muted);
}

/* ============================================================
   Property Detail
============================================================ */

.detail-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 22px;
    align-items: start;
}

.detail-card {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    padding: 22px;
    margin-bottom: 18px;
}

.gallery-main {
    border-radius: var(--radius-lg);
    overflow: hidden;
    background: var(--bg-soft);
    height: 420px;
}

.gallery-main img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.gallery-thumbs {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 10px;
    margin-top: 10px;
}

.gallery-thumb {
    border: 2px solid transparent;
    border-radius: 14px;
    overflow: hidden;
    height: 82px;
    background: var(--bg-soft);
    cursor: pointer;
    padding: 0;
}

.gallery-thumb.active {
    border-color: var(--primary);
}

.gallery-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.detail-title h1 {
    margin: 0 0 10px;
    font-size: clamp(28px, 4vw, 42px);
    line-height: 1.18;
    letter-spacing: -0.04em;
}

.detail-location {
    color: var(--text-muted);
    margin: 0 0 14px;
}

.detail-price {
    color: var(--primary-dark);
    font-weight: 900;
    font-size: 28px;
}

.detail-meta-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}

.detail-meta-item {
    padding: 14px;
    border-radius: 16px;
    background: var(--bg);
    border: 1px solid var(--border);
}

.detail-meta-item small {
    display: block;
    color: var(--text-muted);
    margin-bottom: 4px;
}

.detail-meta-item strong {
    font-size: 16px;
}

.facility-list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}

.facility-item {
    display: flex;
    align-items: center;
    gap: 8px;
    background: var(--primary-light);
    color: var(--primary-dark);
    border: 1px solid #bae6fd;
    border-radius: 14px;
    padding: 10px 12px;
    font-weight: 800;
}

.nearby-group {
    margin-bottom: 18px;
}

.nearby-group h3 {
    margin: 0 0 10px;
    font-size: 18px;
}

.nearby-list {
    display: grid;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.nearby-list li {
    background: var(--bg);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 12px;
}

.nearby-list strong {
    color: var(--text);
}

.nearby-list span {
    color: var(--primary-dark);
    font-weight: 900;
    margin-left: 6px;
}

.nearby-list small {
    display: block;
    color: var(--text-muted);
    margin-top: 3px;
}

.contact-sidebar {
    position: sticky;
    top: 112px;
}

.owner-box {
    text-align: center;
}

.owner-avatar {
    width: 72px;
    height: 72px;
    margin: 0 auto 12px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: var(--primary-soft);
    color: var(--primary-dark);
    font-size: 30px;
    font-weight: 900;
}

.owner-box h3 {
    margin: 0 0 4px;
}

.owner-box p {
    margin: 0 0 16px;
    color: var(--text-muted);
}

.contact-actions {
    display: grid;
    gap: 10px;
}

.map-box {
    border-radius: var(--radius-lg);
    overflow: hidden;
    background: var(--bg-soft);
    min-height: 320px;
    border: 1px solid var(--border);
}

.map-box iframe {
    width: 100%;
    height: 360px;
    border: 0;
}

/* ============================================================
   Articles
============================================================ */

.article-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}

.article-card {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 22px;
    box-shadow: var(--shadow-sm);
    overflow: hidden;
    transition: 0.2s ease;
}

.article-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow);
}

.article-image {
    height: 190px;
    background: var(--bg-soft);
}

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

.article-body {
    padding: 18px;
}

.article-category {
    color: var(--primary-dark);
    font-weight: 900;
    font-size: 13px;
    margin-bottom: 8px;
}

.article-body h3 {
    margin: 0 0 10px;
    font-size: 20px;
    line-height: 1.35;
}

.article-body p {
    color: var(--text-muted);
    margin: 0 0 14px;
}

.article-detail {
    max-width: 860px;
    margin: 0 auto;
}

.article-detail h1 {
    font-size: clamp(30px, 4vw, 46px);
    line-height: 1.16;
    letter-spacing: -0.04em;
}

.article-cover {
    border-radius: var(--radius-lg);
    overflow: hidden;
    margin: 24px 0;
}

.article-content {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: 28px;
    box-shadow: var(--shadow-sm);
}

.article-content h2,
.article-content h3 {
    line-height: 1.35;
}

.article-content p {
    color: var(--text-soft);
}

/* ============================================================
   Auth
============================================================ */

.auth-section {
    padding: 56px 0;
}

.auth-card {
    width: min(520px, calc(100% - 32px));
    margin: 0 auto;
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow);
    padding: 32px;
}

.auth-card h1 {
    margin: 0 0 8px;
    font-size: 30px;
    letter-spacing: -0.03em;
}

.auth-card .auth-desc {
    color: var(--text-muted);
    margin: 0 0 22px;
}

.auth-footer {
    margin-top: 18px;
    text-align: center;
    color: var(--text-muted);
}

/* ============================================================
   Owner Pages
============================================================ */

.dashboard-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 20px;
}

.summary-card {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 20px;
    padding: 18px;
    box-shadow: var(--shadow-sm);
}

.summary-card strong {
    display: block;
    color: var(--primary-dark);
    font-size: 28px;
    line-height: 1;
}

.summary-card span {
    color: var(--text-muted);
}

.table-card {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
}

.table-responsive {
    overflow-x: auto;
}

.table {
    width: 100%;
    border-collapse: collapse;
    min-width: 760px;
}

.table th,
.table td {
    padding: 13px 14px;
    border-bottom: 1px solid var(--border);
    vertical-align: middle;
    text-align: left;
}

.table th {
    background: var(--bg-soft);
    font-size: 13px;
    color: var(--text-soft);
    white-space: nowrap;
}

.table td {
    color: var(--text);
}

.table tr:last-child td {
    border-bottom: none;
}

.table-actions {
    display: flex;
    align-items: center;
    gap: 7px;
    flex-wrap: wrap;
}

/* ============================================================
   Nearby Dynamic Inputs
============================================================ */

.nearby-builder {
    display: grid;
    gap: 12px;
}

.nearby-row {
    display: grid;
    grid-template-columns: 1fr 1.3fr 0.8fr 1fr auto;
    gap: 10px;
    align-items: end;
    padding: 12px;
    background: var(--bg);
    border: 1px solid var(--border);
    border-radius: 16px;
}

.nearby-row .btn {
    min-width: 44px;
}

/* ============================================================
   Ads
============================================================ */

.ad-zone {
    width: min(var(--container), calc(100% - 32px));
    margin: 18px auto;
}

.ad-box {
    width: 100%;
    max-width: var(--ad-width, 100%);
    min-height: auto;
    border-radius: 18px;
    overflow: hidden;
    background: var(--bg-soft);
    border: 1px solid var(--border);
    margin: 0 auto;
}

.ad-box img {
    width: 100%;
    height: auto;
    display: block;
}

.ad-sidebar {
    margin-bottom: 14px;
}

.ad-mobile-banner {
    display: none;
}

.popup-ad-overlay {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.58);
    z-index: 9999;
    display: grid;
    place-items: center;
    padding: 20px;
}

.popup-ad {
    width: min(520px, 100%);
    position: relative;
    background: var(--white);
    border-radius: 24px;
    padding: 10px;
    box-shadow: var(--shadow-lg);
}

.popup-ad img {
    width: 100%;
    border-radius: 18px;
}

.popup-ad-close {
    position: absolute;
    right: -12px;
    top: -12px;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    border: 0;
    background: var(--text);
    color: #ffffff;
    font-size: 28px;
    line-height: 1;
}

/* ============================================================
   Footer
============================================================ */

.site-footer {
    background: #0f172a;
    color: #cbd5e1;
    margin-top: 44px;
}

.footer-main {
    padding: 50px 0 36px;
}

.footer-grid {
    display: grid;
    grid-template-columns: 1.5fr repeat(4, 1fr);
    gap: 26px;
}

.footer-logo {
    color: #ffffff;
    margin-bottom: 14px;
}

.footer-logo strong {
    color: #ffffff;
}

.footer-logo small {
    color: #94a3b8;
}

.footer-about p {
    color: #cbd5e1;
}

.footer-col h3 {
    color: #ffffff;
    margin: 0 0 14px;
    font-size: 17px;
}

.footer-col ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-col li {
    margin-bottom: 9px;
}

.footer-col a {
    color: #cbd5e1;
}

.footer-col a:hover {
    color: #ffffff;
}

.footer-contact p {
    margin: 6px 0;
}

.footer-bottom {
    border-top: 1px solid rgba(226, 232, 240, 0.12);
    padding: 18px 0;
}

.footer-bottom-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.footer-bottom p {
    margin: 0;
}

.footer-social {
    display: flex;
    gap: 14px;
}

/* ============================================================
   Pagination
============================================================ */

.pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 28px;
    flex-wrap: wrap;
}

.page-link,
.page-dots {
    min-width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    border: 1px solid var(--border);
    background: var(--white);
    color: var(--text-soft);
    font-weight: 800;
    padding: 0 12px;
}

.page-link:hover,
.page-link.active {
    background: var(--primary);
    color: #ffffff;
    border-color: var(--primary);
}

.page-dots {
    border-color: transparent;
    background: transparent;
}

/* ============================================================
   Admin Basic Shared Styles
============================================================ */

.admin-body {
    background: #f8fafc;
}

.admin-layout {
    display: grid;
    grid-template-columns: 260px 1fr;
    min-height: 100vh;
}

.admin-sidebar {
    background: #0f172a;
    color: #cbd5e1;
    padding: 20px;
    position: sticky;
    top: 0;
    height: 100vh;
    overflow-y: auto;
}

.admin-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #ffffff;
    margin-bottom: 22px;
}

.admin-nav {
    display: grid;
    gap: 6px;
}

.admin-nav a {
    color: #cbd5e1;
    padding: 10px 12px;
    border-radius: 12px;
    font-weight: 700;
}

.admin-nav a:hover,
.admin-nav a.active {
    background: rgba(14, 165, 233, 0.16);
    color: #ffffff;
}

.admin-content {
    padding: 24px;
}

.admin-topbar {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 20px;
    padding: 16px 18px;
    margin-bottom: 20px;
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: center;
    box-shadow: var(--shadow-sm);
}

.admin-topbar h1 {
    margin: 0;
    font-size: 26px;
}

.admin-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}

.admin-card {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 20px;
    padding: 18px;
    box-shadow: var(--shadow-sm);
}

.admin-card strong {
    display: block;
    color: var(--primary-dark);
    font-size: 30px;
    line-height: 1;
}

/* ============================================================
   Responsive
============================================================ */

@media (max-width: 1100px) {
    .search-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .property-grid,
    .article-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .footer-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .detail-layout {
        grid-template-columns: 1fr;
    }

    .contact-sidebar {
        position: static;
    }

    .listing-layout {
        grid-template-columns: 1fr;
    }

    .filter-sidebar {
        position: static;
    }
}

@media (max-width: 860px) {
    .top-strip {
        display: none;
    }

    .main-header-inner {
        min-height: 68px;
    }

    .nav-toggle {
        display: inline-block;
        margin-left: auto;
    }

    .main-nav {
        position: absolute;
        left: 16px;
        right: 16px;
        top: 72px;
        display: none;
        flex-direction: column;
        align-items: stretch;
        gap: 4px;
        background: var(--white);
        border: 1px solid var(--border);
        border-radius: 20px;
        box-shadow: var(--shadow);
        padding: 12px;
        z-index: 200;
    }

    .main-nav.open {
        display: flex;
    }

    .main-nav a {
        border-radius: 12px;
        padding: 12px;
    }

    .header-actions {
        display: none;
    }

    .hero-inner {
        grid-template-columns: 1fr;
    }

    .hero-visual {
        order: -1;
    }

    .hero-card-image {
        height: 220px;
    }

    .hero-floating {
        right: 10px;
        bottom: 20px;
    }

    .search-grid {
        grid-template-columns: 1fr;
    }

    .detail-meta-grid {
        grid-template-columns: 1fr;
    }

    .facility-list {
        grid-template-columns: repeat(2, 1fr);
    }

    .gallery-main {
        height: 300px;
    }

    .gallery-thumbs {
        grid-template-columns: repeat(4, 1fr);
    }

    .dashboard-summary,
    .admin-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .admin-layout {
        grid-template-columns: 1fr;
    }

    .admin-sidebar {
        position: static;
        height: auto;
    }

    .nearby-row {
        grid-template-columns: 1fr;
    }

    .ad-mobile-banner {
        display: block;
        margin: 10px auto;
    }
}

@media (max-width: 640px) {
    body {
        font-size: 14px;
    }

    .container {
        width: min(100% - 24px, var(--container));
    }

    .section {
        padding: 38px 0;
    }

    .section-header {
        display: block;
    }

    .hero {
        padding: 32px 0 46px;
    }

    .hero h1 {
        font-size: 34px;
    }
    .property-grid,
    .article-grid {
        grid-template-columns: 1fr;
    }

    .search-box {
        padding: 16px;
        border-radius: 22px;
    }

    .property-card-image {
        height: 220px;
    }

    .footer-grid {
        grid-template-columns: 1fr;
    }

    .footer-bottom-inner {
        display: block;
        text-align: center;
    }

    .footer-social {
        justify-content: center;
        margin-top: 10px;
        flex-wrap: wrap;
    }

    .checkbox-grid {
        grid-template-columns: 1fr;
    }

    .form-grid {
        grid-template-columns: 1fr;
    }

    .col-12,
    .col-11,
    .col-10,
    .col-9,
    .col-8,
    .col-7,
    .col-6,
    .col-5,
    .col-4,
    .col-3,
    .col-2,
    .col-1 {
        grid-column: span 1;
    }

    .auth-card {
        padding: 22px;
        border-radius: 22px;
    }

    .listing-toolbar {
        display: block;
    }

    .sort-box {
        margin-top: 12px;
        display: block;
    }

    .sort-box select {
        margin-top: 6px;
        min-width: 100%;
    }

    .facility-list {
        grid-template-columns: 1fr;
    }

    .gallery-thumbs {
        grid-template-columns: repeat(3, 1fr);
    }

    .dashboard-summary,
    .admin-grid {
        grid-template-columns: 1fr;
    }
}
/* Branding & accessibility */
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.site-logo img{display:block;width:min(300px,42vw);height:auto;object-fit:contain}.footer-logo-image img{display:block;width:min(280px,100%);height:auto}.legal-page{padding:48px 0}.legal-card{max-width:920px;margin:auto;background:#fff;border:1px solid #e8eef6;border-radius:20px;padding:clamp(24px,4vw,48px);box-shadow:0 14px 40px rgba(8,70,130,.08)}.legal-card h1{color:#074ca5}.legal-card h2{margin-top:28px;color:#0b63b6}.legal-card p,.legal-card li{line-height:1.85;color:#334155}@media(max-width:768px){.site-logo img{width:210px}.footer-logo-image img{width:230px}}

/* Hahongpak compact logo v1.1 */
.site-logo {
    width: auto;
    max-width: 220px;
    line-height: 0;
}
.site-logo img {
    display: block;
    width: 220px !important;
    max-width: 100%;
    height: 64px !important;
    object-fit: contain;
    object-position: left center;
}
.footer-logo-image {
    width: auto;
    max-width: 230px;
    line-height: 0;
}
.footer-logo-image img {
    display: block;
    width: 230px !important;
    max-width: 100%;
    height: 68px !important;
    object-fit: contain;
    object-position: left center;
}
@media (max-width: 768px) {
    .site-logo { max-width: 174px; }
    .site-logo img { width: 174px !important; height: 52px !important; }
    .footer-logo-image { max-width: 200px; }
    .footer-logo-image img { width: 200px !important; height: 60px !important; }
}

/* Hahongpak transparent logo sizing v1.2 */
.site-logo {
    display: inline-flex;
    align-items: center;
    width: 210px;
    max-width: 38vw;
    line-height: 0;
    flex: 0 0 auto;
}
.site-logo img {
    display: block;
    width: 100% !important;
    height: auto !important;
    max-height: 58px;
    object-fit: contain;
    object-position: left center;
}
.footer-logo-image {
    display: inline-block;
    width: 240px;
    max-width: 100%;
    line-height: 0;
}
.footer-logo-image img {
    display: block;
    width: 100% !important;
    height: auto !important;
    max-height: 64px;
    object-fit: contain;
    object-position: left center;
}
@media (max-width: 768px) {
    .site-logo { width: 170px; max-width: 52vw; }
    .site-logo img { max-height: 46px; }
    .footer-logo-image { width: 210px; }
    .footer-logo-image img { max-height: 56px; }
}

/* Hahongpak brand fallback and uploaded assets */
.site-brand-demo,.footer-brand-demo{display:inline-flex;align-items:center;gap:10px;text-decoration:none}.site-brand-demo img{display:block;width:auto;max-width:220px;height:52px;object-fit:contain}.footer-brand-demo img{display:block;width:auto;max-width:250px;height:68px;object-fit:contain}.site-brand-mark{width:44px;height:44px;border-radius:13px;display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#0757b8,#12bee0);color:#fff;font-weight:900;font-size:25px;box-shadow:0 8px 20px rgba(8,119,209,.22)}.site-brand-copy{display:flex;flex-direction:column;line-height:1.08}.site-brand-copy strong{font-size:22px;color:#0750ad;letter-spacing:-.4px}.site-brand-copy small{font-size:12px;color:#159fcf;letter-spacing:.7px;margin-top:4px}.footer-brand-demo .site-brand-copy strong{color:#fff}.footer-brand-demo .site-brand-copy small{color:#8edff3}@media(max-width:767px){.site-brand-demo img{max-width:170px;height:44px}.site-brand-mark{width:38px;height:38px;font-size:21px}.site-brand-copy strong{font-size:18px}.site-brand-copy small{font-size:10px}}


/* Hahongpak default brand logo and admin-uploaded replacement */
.site-logo.site-brand-demo{display:inline-flex;align-items:center;width:auto;max-width:310px;min-width:0}
.site-logo.site-brand-demo img{display:block;width:auto!important;height:58px!important;max-width:310px!important;object-fit:contain;object-position:left center}
.footer-logo.footer-brand-demo{display:inline-flex;align-items:center;width:auto;max-width:300px}
.footer-logo.footer-brand-demo img{display:block;width:auto!important;height:72px!important;max-width:300px!important;object-fit:contain;object-position:left center}
@media(max-width:767px){
  .site-logo.site-brand-demo{max-width:220px}
  .site-logo.site-brand-demo img{height:48px!important;max-width:220px!important}
  .footer-logo.footer-brand-demo{max-width:240px}
  .footer-logo.footer-brand-demo img{height:58px!important;max-width:240px!important}
}

/* Cookie consent and facility icons */
.cookie-consent{position:fixed;left:0;right:0;bottom:0;z-index:99990;padding:16px;transform:translateY(120%);opacity:0;transition:.25s ease}.cookie-consent.is-visible{transform:none;opacity:1}.cookie-consent-inner{max-width:1180px;margin:auto;display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;background:#fff;border:1px solid #dbeafe;border-radius:18px;padding:18px 20px;box-shadow:0 20px 60px rgba(15,23,42,.22)}.cookie-consent-icon{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:#e0f2fe;color:#0284c7;font-size:23px}.cookie-consent-copy strong{font-size:17px;color:#0f172a}.cookie-consent-copy p{margin:4px 0 0;color:#64748b;line-height:1.6;font-size:13px}.cookie-consent-copy a{color:#0369a1;font-weight:700}.cookie-consent-actions{display:flex;gap:9px}.cookie-btn{border-radius:11px;padding:10px 15px;font-weight:800;cursor:pointer;white-space:nowrap}.cookie-essential{background:#fff;border:1px solid #cbd5e1;color:#334155}.cookie-accept{background:#0284c7;border:1px solid #0284c7;color:#fff}.facility-icon{width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;border-radius:10px;background:#eaf6ff;color:#0877d1;flex:0 0 34px;font-size:16px}.facility-icon img{width:22px;height:22px;object-fit:contain}.facility-item,.facility-check,.facility-option label{display:flex;align-items:center;gap:10px}.footer-logo img{display:block;max-width:240px;width:100%;height:auto;object-fit:contain}@media(max-width:720px){.cookie-consent-inner{grid-template-columns:auto 1fr}.cookie-consent-actions{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr}.cookie-btn{width:100%}}


/* Modern image uploader */
.modern-image-uploader{position:relative;min-height:180px;border:2px dashed #93c5fd;border-radius:18px;background:linear-gradient(180deg,#f8fcff,#eef8ff);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:28px 20px;cursor:pointer;transition:.2s ease;overflow:hidden}.modern-image-uploader:hover,.modern-image-uploader.is-dragover{border-color:#0877d1;background:#eaf6ff;transform:translateY(-1px);box-shadow:0 12px 30px rgba(8,119,209,.12)}.modern-upload-icon{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;background:#fff;color:#0877d1;font-size:27px;box-shadow:0 9px 24px rgba(8,119,209,.15);margin-bottom:12px}.modern-upload-title{font-weight:900;color:#0f172a;font-size:16px}.modern-upload-help{font-size:12px;color:#64748b;margin-top:6px}.modern-upload-input{position:absolute!important;inset:0;width:100%!important;height:100%!important;opacity:0!important;cursor:pointer!important;z-index:2}.modern-upload-preview{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px;margin-top:15px}.modern-upload-preview-card{min-width:0;border:1px solid #dbeafe;background:#fff;border-radius:15px;overflow:hidden;box-shadow:0 8px 22px rgba(15,23,42,.08)}.modern-upload-preview-card img{width:100%;height:125px;display:block;object-fit:cover;background:#f1f5f9}.modern-upload-preview-meta{padding:10px;display:flex;flex-direction:column;gap:3px}.modern-upload-preview-meta strong{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#0f172a}.modern-upload-preview-meta span{font-size:11px;color:#64748b}.swal2-container{z-index:100000!important}.flash-wrap[hidden]{display:none!important}@media(max-width:640px){.modern-image-uploader{min-height:155px;padding:22px 14px}.modern-upload-preview{grid-template-columns:repeat(2,minmax(0,1fr))}.modern-upload-preview-card img{height:105px}}


/* Hahongpak responsive polish v2.4 */
.site-logo.site-brand-demo img{width:min(360px,34vw)!important;height:64px!important;max-width:100%!important;object-fit:contain}.footer-logo.footer-brand-demo img{width:min(340px,100%)!important;height:auto!important;max-height:92px!important}.contact-list li{align-items:flex-start}.contact-list li i{margin-top:4px}.contact-list li a{color:inherit;font-weight:700}
.contact-channel-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:12px}.contact-channel-rows{display:grid;gap:10px}.contact-channel-row{display:grid;grid-template-columns:1fr 1.2fr 1fr 1.4fr auto;gap:10px;align-items:center;padding:12px;border:1px solid #dbe7f4;border-radius:14px;background:#f8fbff}.contact-channel-row input{min-width:0}
.admin-panel{background:#fff;border:1px solid #e3edf7;border-radius:20px;padding:22px;margin-bottom:20px;box-shadow:0 12px 32px rgba(15,71,120,.07)}.panel-heading{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:18px}.panel-heading h2{margin:0;color:#10233f;font-size:20px}.panel-heading h2 i{color:#0877d1;margin-right:7px}.panel-heading p{margin:5px 0 0;color:#6b7c93;font-size:13px}.contact-admin-hero{background:linear-gradient(135deg,#eff8ff,#f8fcff);border:1px solid #d8ebfb;border-radius:22px;padding:24px!important;margin-bottom:20px}.contact-admin-hero h1{margin:7px 0 4px}.contact-admin-hero p{margin:0;color:#60738a}.admin-eyebrow{font-size:12px;font-weight:900;letter-spacing:.12em;color:#0877d1}.contact-admin-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:20px}.contact-admin-stats article{display:flex;align-items:center;gap:13px;background:#fff;border:1px solid #e3edf7;border-radius:18px;padding:17px;box-shadow:0 9px 24px rgba(15,71,120,.06)}.contact-admin-stats small{display:block;color:#6b7c93}.contact-admin-stats strong{font-size:22px;color:#10233f}.stat-icon{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;font-size:19px}.stat-icon.blue{background:#e8f3ff;color:#0877d1}.stat-icon.cyan{background:#e6fbff;color:#08a6c4}.stat-icon.green{background:#eafbf2;color:#16a362}.stat-icon.purple{background:#f2ecff;color:#7c4dff}.contact-tool-actions{display:flex;flex-wrap:wrap;gap:10px}.contact-message-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.contact-message-card{border:1px solid #dfeaf5;border-radius:18px;padding:17px;background:linear-gradient(180deg,#fff,#fbfdff);min-width:0}.message-card-head{display:flex;align-items:center;gap:11px}.message-card-head h3{margin:0;font-size:16px}.message-card-head time{font-size:11px;color:#8795a8}.message-avatar{width:42px;height:42px;border-radius:13px;background:linear-gradient(135deg,#0877d1,#21c6de);color:#fff;display:grid;place-items:center;font-weight:900}.message-id{margin-left:auto;font-size:11px;background:#eef6ff;color:#0877d1;border-radius:999px;padding:5px 9px}.message-contact{display:flex;flex-wrap:wrap;gap:8px 14px;margin:14px 0;font-size:12px;color:#52657b}.message-contact a{color:#0877d1}.message-body{background:#f3f8fd;border-radius:13px;padding:13px;line-height:1.7;color:#26384e;word-break:break-word}.log-badge{display:inline-flex;border-radius:999px;padding:4px 8px;font-size:10px;font-weight:900}.log-info{background:#e9f7ef;color:#16824a}.log-warning{background:#fff5d8;color:#9b6900}.log-error{background:#feecec;color:#c63838}.empty-state{text-align:center;padding:45px 20px;color:#738399}.empty-state i{font-size:45px;color:#a9c7e1}.empty-state h3{color:#233a55;margin-bottom:5px}
@media(max-width:1100px){.main-header-inner{gap:14px}.main-nav{gap:2px}.main-nav a{padding:10px 8px;font-size:13px}.site-logo.site-brand-demo img{width:260px!important}.contact-admin-stats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){.admin-layout{display:block}.admin-sidebar{position:relative!important;inset:auto!important;width:100%!important;min-height:auto!important;padding:12px!important}.admin-brand{margin-bottom:10px}.admin-nav{display:flex!important;overflow-x:auto;gap:8px;padding-bottom:4px;scrollbar-width:thin}.admin-nav a{flex:0 0 auto;white-space:nowrap;padding:9px 12px!important;border-radius:10px}.admin-content{margin-left:0!important;width:100%!important;padding:16px!important}.contact-message-grid{grid-template-columns:1fr}.contact-channel-row{grid-template-columns:1fr 1fr}.contact-channel-row .remove-contact-channel{grid-column:2;justify-self:end}.detail-layout{grid-template-columns:1fr!important}.site-logo.site-brand-demo img{width:235px!important;height:54px!important}}
@media(max-width:720px){.top-strip{display:none}.main-header-inner{min-height:70px}.site-logo.site-brand-demo img{width:205px!important;height:48px!important}.header-actions{display:none}.main-nav{width:min(88vw,340px)!important}.footer-grid{grid-template-columns:1fr!important}.footer-main{padding-top:34px}.footer-logo.footer-brand-demo img{width:280px!important;max-height:76px!important}.contact-admin-hero{align-items:flex-start!important;flex-direction:column}.contact-admin-stats{grid-template-columns:1fr 1fr}.contact-channel-heading{align-items:flex-start;flex-direction:column}.contact-channel-row{grid-template-columns:1fr}.contact-channel-row .remove-contact-channel{grid-column:1;justify-self:stretch}.form-grid .col-4,.form-grid .col-6{grid-column:span 12!important}.contact-tool-actions{display:grid}.contact-tool-actions form,.contact-tool-actions button{width:100%}.admin-panel{padding:15px;border-radius:16px}.table{min-width:680px}.page-hero{padding:38px 0}.section{padding:36px 0}.form-card,.sidebar-card{padding:18px!important}}
@media(max-width:480px){.contact-admin-stats{grid-template-columns:1fr}.site-logo.site-brand-demo img{width:185px!important}.footer-logo.footer-brand-demo img{width:245px!important}.admin-content{padding:11px!important}.contact-message-card{padding:14px}.message-contact{display:grid}.btn{white-space:normal}}


/* ===== Hahongpak UX refresh 3.0 ===== */
.modern-legal-card{max-width:940px;margin:auto;padding:clamp(24px,5vw,56px);border-radius:28px;background:#fff;box-shadow:0 18px 60px rgba(15,76,129,.10);line-height:1.85}.modern-legal-card h1{font-size:clamp(30px,5vw,48px);margin:.25em 0}.modern-legal-card h2{font-size:22px;color:#0b4ea2;margin-top:32px}.legal-kicker{display:inline-flex;gap:10px;align-items:center;padding:9px 14px;border-radius:999px;background:#eaf6ff;color:#0877d1;font-weight:700}
.property-gallery-card{padding:14px}.property-gallery{position:relative}.gallery-main{position:relative;aspect-ratio:16/10;border-radius:22px;overflow:hidden;background:#eef5fb;cursor:zoom-in}.gallery-main>img{width:100%;height:100%;object-fit:cover}.gallery-nav{position:absolute;z-index:5;top:45%;width:46px;height:46px;border:0;border-radius:50%;background:rgba(0,0,0,.55);color:#fff;font-size:20px;cursor:pointer}.gallery-prev{left:24px}.gallery-next{right:24px}.gallery-fullscreen{position:absolute;right:16px;top:16px;border:0;border-radius:999px;background:rgba(4,30,66,.76);color:#fff;padding:10px 14px;font-weight:700;cursor:pointer}.gallery-counter{position:absolute;right:18px;bottom:16px;background:rgba(4,30,66,.76);color:#fff;border-radius:999px;padding:7px 12px}.image-watermark{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);color:rgba(255,255,255,.88);font-size:clamp(18px,3vw,34px);font-weight:900;text-shadow:0 2px 8px rgba(0,0,0,.65);letter-spacing:.5px;pointer-events:none;user-select:none}.gallery-thumbs{display:flex;gap:10px;overflow-x:auto;padding:12px 2px 2px}.gallery-thumb{flex:0 0 92px;height:68px;border:3px solid transparent;border-radius:13px;overflow:hidden;padding:0;background:#fff}.gallery-thumb.active{border-color:#1594e8}.gallery-thumb img{width:100%;height:100%;object-fit:cover}.gallery-lightbox{position:fixed;inset:0;z-index:99999;background:rgba(0,0,0,.94);display:grid;place-items:center}.gallery-lightbox[hidden]{display:none}.lightbox-stage{position:relative;width:min(88vw,1400px);height:86vh;display:grid;place-items:center}.lightbox-stage img{max-width:100%;max-height:100%;object-fit:contain}.lightbox-close,.lightbox-prev,.lightbox-next{position:fixed;z-index:2;border:0;background:rgba(255,255,255,.15);color:#fff;border-radius:50%;width:52px;height:52px;font-size:23px}.lightbox-close{top:20px;right:20px}.lightbox-prev{left:20px;top:48%}.lightbox-next{right:20px;top:48%}.lightbox-counter{position:fixed;bottom:20px;color:#fff;background:rgba(255,255,255,.15);padding:8px 16px;border-radius:999px}.lightbox-open{overflow:hidden}
.back-to-top{position:fixed;right:22px;bottom:24px;z-index:800;width:48px;height:48px;border:0;border-radius:50%;background:linear-gradient(135deg,#0877d1,#18c0e8);color:white;box-shadow:0 10px 28px rgba(8,119,209,.35);opacity:0;visibility:hidden;transform:translateY(15px);transition:.25s;cursor:pointer}.back-to-top.show{opacity:1;visibility:visible;transform:none}
.articles-page .article-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.articles-page .article-card{border-radius:18px;overflow:hidden}.articles-page .article-image{aspect-ratio:16/9}.articles-page .article-body{padding:18px}.articles-page .article-body h2{font-size:18px;line-height:1.45;margin:8px 0}.articles-page .article-body p{font-size:14px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.province-tabs{display:flex;gap:10px;overflow-x:auto;margin:0 0 22px;padding-bottom:4px}.province-tab{border:1px solid #d8e6f2;background:#fff;border-radius:999px;padding:10px 18px;white-space:nowrap;font-weight:700;color:#35536c}.province-tab.active{background:#0877d1;color:#fff;border-color:#0877d1}.province-recommend-grid{display:none;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}.province-recommend-grid.active{display:grid}
.admin-login-page,.admin-login-body{min-height:100vh;background:radial-gradient(circle at top left,#dff5ff,transparent 35%),linear-gradient(135deg,#f7fbff,#edf5ff)}.admin-login-card{border-radius:28px!important;box-shadow:0 28px 70px rgba(18,72,120,.18)!important;border:1px solid rgba(255,255,255,.8)!important}.admin-sidebar{box-shadow:8px 0 30px rgba(10,50,90,.08)}.admin-content{min-width:0}.admin-card,.form-card{border-radius:20px!important}.table-responsive{overflow-x:auto;-webkit-overflow-scrolling:touch}
@media(max-width:1280px){.province-recommend-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:1100px){.articles-page .article-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.province-recommend-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:768px){.gallery-nav{width:40px;height:40px}.gallery-prev{left:8px}.gallery-next{right:8px}.gallery-fullscreen{font-size:0;padding:11px}.gallery-fullscreen i{font-size:18px}.lightbox-prev{left:8px}.lightbox-next{right:8px}.articles-page .listing-layout{display:block}.articles-page .filter-sidebar{margin-bottom:18px}.articles-page .article-grid{grid-template-columns:1fr}.province-recommend-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-layout{display:block}.admin-sidebar{position:relative!important;width:100%!important;height:auto!important}.admin-nav{display:flex!important;overflow-x:auto;padding:10px}.admin-nav a{white-space:nowrap}.admin-content{padding:16px!important}.admin-topbar{align-items:flex-start;gap:12px}.form-grid{grid-template-columns:1fr!important}.form-group[class*=col-]{grid-column:1/-1!important}.gallery-main{aspect-ratio:4/3}.site-footer .footer-grid{grid-template-columns:1fr!important}.back-to-top{right:14px;bottom:16px}}

.contact-channel-image-icon,.contact-icon-preview,.popular-place-icon-image{width:42px;height:42px;object-fit:contain;border-radius:12px;background:#eef8ff;padding:5px;flex:0 0 auto}.contact-icon-preview{display:inline-block;margin:6px}.mini-upload{display:inline-flex;align-items:center;gap:8px;background:#edf7ff;color:#0877d1;padding:9px 12px;border-radius:10px;font-weight:700;cursor:pointer}.mini-upload input{max-width:190px}.contact-channel-row{align-items:center;grid-template-columns:1fr 1fr 1fr 1fr 1fr auto!important}@media(max-width:900px){.contact-channel-row{grid-template-columns:1fr!important}}

/* Admin sidebar: เมนูครบทุกหน้าและเลื่อนได้ */
.admin-sidebar{overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
.admin-nav a{display:flex;align-items:center;gap:10px}
.admin-nav a i{width:20px;text-align:center;flex:0 0 20px}
@media(max-width:560px){.province-recommend-grid{grid-template-columns:1fr}.admin-nav a i{display:inline-block}}

/* ===== Article archive refresh 3.5 ===== */
.articles-page{background:#fbfdff}.articles-hero{padding:28px 0 0}.articles-hero-card{position:relative;min-height:270px;display:grid;grid-template-columns:minmax(0,1.65fr) minmax(260px,.65fr);overflow:hidden;border:1px solid #dceaf7;border-radius:26px;background:linear-gradient(115deg,#f4f9ff 0%,#eef7ff 52%,#dceefc 100%);box-shadow:0 14px 40px rgba(25,81,125,.08)}.articles-hero-content{position:relative;z-index:2;padding:36px 42px}.articles-eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--primary-dark);font-size:13px;font-weight:800}.articles-hero h1{margin:7px 0 4px;color:#132a46;font-size:clamp(32px,4vw,48px);line-height:1.18;letter-spacing:-.04em}.articles-hero p{margin:0 0 22px;color:#61758b}.articles-hero-search{display:flex;align-items:center;max-width:720px;height:54px;padding-left:18px;border:1px solid #d9e6f2;border-radius:999px;background:#fff;box-shadow:0 8px 22px rgba(26,87,140,.12)}.articles-hero-search>i{color:#91a7ba}.articles-hero-search input{min-width:0;flex:1;height:100%;padding:0 14px;border:0;background:transparent;outline:0}.articles-hero-search .btn{height:46px;margin-right:4px;padding:0 23px;border-radius:999px}.articles-popular-tags{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:17px;font-size:12px}.articles-popular-tags strong{color:#354b63}.articles-popular-tags a{padding:6px 11px;border:1px solid #dbe8f4;border-radius:999px;background:rgba(255,255,255,.82);color:#536a80;font-weight:700}.articles-popular-tags a:hover{border-color:var(--primary);color:var(--primary)}.articles-hero-visual{position:relative;display:grid;place-items:center;background:radial-gradient(circle at 50% 50%,rgba(255,255,255,.95),rgba(255,255,255,0) 64%)}.hero-visual-circle{width:155px;height:155px;display:grid;place-items:center;border:14px solid rgba(255,255,255,.45);border-radius:50%;background:linear-gradient(145deg,#fff,#cce5f7);color:#217db8;font-size:66px;box-shadow:0 20px 34px rgba(30,89,129,.16)}.hero-visual-note{position:absolute;right:26px;bottom:25px;padding:9px 13px;border-radius:12px;background:#fff;color:#3a5368;font-size:12px;font-weight:800;box-shadow:0 9px 22px rgba(25,77,119,.13)}.hero-visual-note i{color:#f2b324}
.articles-main-section{padding-top:28px}.articles-layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:28px;align-items:start}.articles-sidebar{position:sticky;top:106px;padding:20px;border:1px solid var(--border);border-radius:20px;background:#fff;box-shadow:var(--shadow-sm)}.articles-sidebar h2{margin:0 0 16px;font-size:19px}.articles-sidebar .filter-group{margin-bottom:14px}.articles-sidebar .filter-actions{display:grid;gap:8px}.articles-category-panel{margin-top:20px;padding-top:20px;border-top:1px solid var(--border)}.articles-category-panel h3{font-size:16px}.articles-category-list{display:grid;gap:7px}.articles-category-list a{display:flex;justify-content:space-between;gap:8px;padding:9px 11px;border:1px solid transparent;border-radius:11px;background:#f7fafc;color:#40566d;font-size:13px}.articles-category-list a:hover,.articles-category-list a.active{border-color:#b9dcf8;background:#eef7ff;color:var(--primary-dark)}.articles-category-list small{min-width:25px;text-align:center;border-radius:99px;background:#fff;color:#71869a}.articles-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:8px}.articles-category-tabs{display:flex;flex-wrap:wrap;gap:8px}.articles-category-tabs a{padding:9px 16px;border:1px solid #e0e9f1;border-radius:999px;background:#f7f9fb;color:#52677b;font-size:13px;font-weight:800}.articles-category-tabs a:hover,.articles-category-tabs a.active{border-color:var(--primary);background:var(--primary);color:#fff;box-shadow:0 7px 16px rgba(8,119,209,.18)}.articles-sort-form select{width:auto;min-width:112px;padding:9px 35px 9px 13px;border-radius:999px;background-color:#fff;font-weight:700}.articles-result-count{margin:0 0 12px;color:#7b8da0;font-size:12px}
.featured-article-card{min-height:305px;display:grid;grid-template-columns:1.05fr 1fr;overflow:hidden;margin-bottom:22px;border:1px solid #dce7f0;border-radius:22px;background:#fff;box-shadow:0 10px 30px rgba(22,69,107,.08)}.featured-article-image{min-height:305px;overflow:hidden}.featured-article-image img{width:100%;height:100%;object-fit:cover;transition:transform .35s}.featured-article-card:hover .featured-article-image img{transform:scale(1.025)}.featured-article-body{display:flex;flex-direction:column;justify-content:center;padding:32px}.featured-article-body h2{margin:6px 0 10px;font-size:clamp(24px,2.6vw,34px);line-height:1.28;letter-spacing:-.03em}.featured-article-body p{margin:0 0 17px;color:var(--text-muted);line-height:1.7}.featured-read-more,.article-read-more,.articles-all-properties{display:inline-flex;align-items:center;gap:7px;color:var(--primary);font-weight:900}.featured-read-more{align-self:flex-start;padding:9px 15px;border-radius:999px;background:var(--primary);color:#fff}.article-meta{display:flex;align-items:center;gap:6px;margin-top:17px;color:#8393a5;font-size:12px}.articles-page .article-grid{gap:18px}.articles-page .article-card{display:flex;flex-direction:column;border-color:#e1e9f0;box-shadow:0 7px 22px rgba(25,71,108,.07)}.articles-page .article-body{display:flex;flex:1;flex-direction:column}.articles-page .article-body h2{display:-webkit-box;overflow:hidden;min-height:52px;-webkit-line-clamp:2;-webkit-box-orient:vertical}.articles-page .article-body p{min-height:63px;margin-bottom:8px}.articles-page .article-category{display:inline-flex;align-self:flex-start;margin:-33px 0 12px;padding:5px 10px;border-radius:999px;background:#fff;box-shadow:0 4px 12px rgba(20,65,101,.12);position:relative}.articles-page .featured-article-body .article-category{margin:0;box-shadow:none;background:#eaf6ff}.articles-page .article-read-more{margin-top:auto;align-self:flex-end;font-size:12px}.articles-page .article-meta{margin-top:15px}.articles-page .section-sm{margin-top:18px;padding-top:36px;border-top:1px solid var(--border)}
@media(max-width:980px){.articles-hero-card{grid-template-columns:1fr}.articles-hero-visual{display:none}.articles-layout{grid-template-columns:1fr}.articles-sidebar{position:static}.articles-sidebar form{display:grid;grid-template-columns:1fr 1fr;gap:14px}.articles-sidebar .filter-actions{grid-column:1/-1;grid-template-columns:1fr 1fr}.articles-category-panel{display:none}}
@media(max-width:700px){.articles-hero{padding-top:15px}.articles-hero-card{min-height:0;border-radius:20px}.articles-hero-content{padding:25px 20px}.articles-hero-search{height:50px}.articles-hero-search .btn{width:44px;padding:0;justify-content:center}.articles-hero-search .btn span{display:none}.articles-popular-tags{overflow-x:auto;flex-wrap:nowrap;padding-bottom:3px}.articles-popular-tags a,.articles-popular-tags strong{white-space:nowrap}.articles-toolbar{align-items:flex-start;flex-direction:column}.articles-category-tabs{max-width:100%;flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px}.articles-category-tabs a{white-space:nowrap}.articles-sort-form,.articles-sort-form select{width:100%}.featured-article-card{grid-template-columns:1fr}.featured-article-image{min-height:210px;max-height:240px}.featured-article-body{padding:22px}.articles-sidebar form{display:block}.articles-sidebar .filter-actions{display:grid;grid-template-columns:1fr}.articles-page .property-grid{grid-template-columns:1fr}.articles-page .section-header{align-items:flex-end}.articles-result-count{margin-top:8px}}

/* Article controls follow the standard 10px interactive radius. */
.articles-page .btn,
.articles-page .featured-read-more,
.articles-page .articles-category-tabs a,
.articles-page .articles-sort-form select,
.articles-page .pagination .page-link {
    border-radius: var(--radius-sm);
}

.articles-page .articles-hero-search {
    border-radius: var(--radius);
}

.articles-page .articles-hero-search .btn {
    border-radius: calc(var(--radius-sm) - 2px);
}

.articles-page .articles-hero-search input,
.articles-page .articles-hero-search input:focus {
    appearance: none;
    -webkit-appearance: none;
    border: 0 !important;
    border-radius: 0;
    background: transparent;
    box-shadow: none !important;
    outline: 0;
}

.articles-page .articles-hero-search input::-webkit-search-decoration,
.articles-page .articles-hero-search input::-webkit-search-cancel-button,
.articles-page .articles-hero-search input::-webkit-search-results-button,
.articles-page .articles-hero-search input::-webkit-search-results-decoration {
    display: none;
    -webkit-appearance: none;
}

.articles-page .articles-hero-search:focus-within {
    border-color: var(--primary);
    box-shadow: 0 0 0 4px rgba(14, 165, 233, .12), 0 8px 22px rgba(26, 87, 140, .12);
}

/* Articles: tablet and mobile layout */
.articles-page {
    overflow-x: clip;
}

.articles-page .articles-layout,
.articles-page .listing-content,
.articles-page .articles-sidebar,
.articles-page .articles-hero-content,
.articles-page .article-card,
.articles-page .property-card {
    min-width: 0;
}

@media (max-width: 1024px) {
    .articles-page .articles-hero-card {
        grid-template-columns: minmax(0, 1fr) 220px;
        min-height: 250px;
    }

    .articles-page .articles-hero-content {
        padding: 30px 32px;
    }

    .articles-page .hero-visual-circle {
        width: 130px;
        height: 130px;
        font-size: 54px;
    }

    .articles-page .articles-layout {
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .articles-page .articles-sidebar {
        position: static;
        width: 100%;
    }

    .articles-page .articles-sidebar > form {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(220px, .7fr);
        gap: 14px;
        align-items: end;
    }

    .articles-page .articles-sidebar .filter-group {
        margin: 0;
    }

    .articles-page .articles-sidebar .filter-actions {
        grid-column: 1 / -1;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .articles-page .articles-category-panel {
        display: none;
    }

    .articles-page .articles-sidebar .ad-zone {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 14px;
        margin: 20px 0 0;
    }

    .articles-page .articles-sidebar .ad-box {
        max-width: 100%;
        margin: 0;
    }

    .articles-page .article-grid,
    .articles-page .property-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .articles-page .container {
        width: calc(100% - 24px);
    }

    .articles-page .ad-zone.ad-zone-mobile_banner {
        width: calc(100% - 24px);
        margin: 12px auto;
    }

    .articles-page .ad-mobile-banner {
        width: 100%;
        max-width: 100%;
        margin: 0;
        border-radius: var(--radius-sm);
    }

    .articles-page .ad-mobile-banner img {
        width: 100%;
        height: auto;
        object-fit: contain;
    }

    .articles-page .articles-hero {
        padding-top: 12px;
    }

    .articles-page .articles-hero-card {
        display: block;
        min-height: 0;
        border-radius: var(--radius);
    }

    .articles-page .articles-hero-content {
        padding: 22px 18px 20px;
    }

    .articles-page .articles-hero-visual {
        display: none;
    }

    .articles-page .articles-eyebrow {
        font-size: 12px;
    }

    .articles-page .articles-hero h1 {
        margin-top: 8px;
        font-size: clamp(28px, 9vw, 36px);
    }

    .articles-page .articles-hero p {
        margin-bottom: 17px;
        font-size: 14px;
        line-height: 1.55;
    }

    .articles-page .articles-hero-search {
        width: 100%;
        height: 48px;
        padding-left: 14px;
    }

    .articles-page .articles-hero-search input {
        width: 0;
        padding: 0 10px;
        font-size: 13px;
        text-overflow: ellipsis;
    }

    .articles-page .articles-hero-search .btn {
        flex: 0 0 42px;
        width: 42px;
        min-height: 40px;
        height: 40px;
        padding: 0;
    }

    .articles-page .articles-hero-search .btn span {
        display: none;
    }

    .articles-page .articles-popular-tags {
        display: flex;
        overflow: visible;
        flex-wrap: wrap;
        gap: 7px;
        margin-top: 14px;
    }

    .articles-page .articles-popular-tags strong {
        width: 100%;
    }

    .articles-page .articles-popular-tags a {
        max-width: 100%;
        padding: 5px 9px;
        white-space: normal;
    }

    .articles-page .articles-popular-tags a:nth-of-type(n+4) {
        display: none;
    }

    .articles-page .articles-main-section {
        padding: 22px 0 34px;
    }

    .articles-page .articles-layout {
        gap: 20px;
    }

    .articles-page .articles-sidebar {
        padding: 17px;
        border-radius: var(--radius);
    }

    .articles-page .articles-sidebar h2 {
        margin-bottom: 14px;
        font-size: 18px;
    }

    .articles-page .articles-sidebar > form {
        display: block;
    }

    .articles-page .articles-sidebar .filter-group {
        margin-bottom: 13px;
    }

    .articles-page .articles-sidebar .filter-actions {
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .articles-page .articles-sidebar .ad-zone {
        display: block;
        width: 100%;
        margin-top: 18px;
    }

    .articles-page .articles-sidebar .ad-box {
        width: min(100%, 300px);
        margin: 0 auto 14px;
    }

    .articles-page .articles-toolbar {
        align-items: stretch;
        flex-direction: column;
        gap: 10px;
    }

    .articles-page .articles-category-tabs {
        display: flex;
        max-width: 100%;
        overflow: visible;
        flex-wrap: wrap;
        gap: 7px;
    }

    .articles-page .articles-category-tabs a {
        padding: 8px 11px;
        white-space: normal;
        font-size: 12px;
    }

    .articles-page .articles-sort-form,
    .articles-page .articles-sort-form select {
        width: 100%;
    }

    .articles-page .featured-article-card {
        grid-template-columns: 1fr;
        min-height: 0;
        border-radius: var(--radius);
    }

    .articles-page .featured-article-image {
        min-height: 0;
        max-height: none;
        aspect-ratio: 16 / 10;
    }

    .articles-page .featured-article-body {
        padding: 20px;
    }

    .articles-page .featured-article-body h2 {
        font-size: 24px;
    }

    .articles-page .article-grid,
    .articles-page .property-grid {
        grid-template-columns: 1fr;
    }

    .articles-page .article-card {
        width: 100%;
    }

    .articles-page .article-image {
        height: auto;
        aspect-ratio: 16 / 9;
    }

    .articles-page .pagination {
        flex-wrap: wrap;
    }

    .articles-page .section-sm {
        padding-bottom: 0;
    }

    .articles-page .section-header {
        display: flex;
        align-items: flex-end;
        gap: 12px;
    }

    .articles-page .section-title {
        font-size: 24px !important;
    }

    .articles-page .section-subtitle {
        font-size: 13px;
    }

    .articles-page .articles-all-properties {
        flex: 0 0 auto;
        font-size: 12px;
        white-space: nowrap;
    }
}

@media (max-width: 380px) {
    .articles-page .articles-hero-content {
        padding-inline: 15px;
    }

    .articles-page .articles-popular-tags a:nth-of-type(n+3) {
        display: none;
    }

    .articles-page .featured-article-body h2 {
        font-size: 21px;
    }

    .articles-page .section-header {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* ===== Home recommendations + Admin redesign 3.1 ===== */
.province-recommend-section{background:linear-gradient(180deg,#f7fbff 0%,#eef7ff 100%);position:relative;overflow:hidden}.province-recommend-section:before{content:"";position:absolute;width:360px;height:360px;border-radius:50%;background:rgba(34,183,235,.08);top:-180px;right:-100px}.recommend-section-shell{position:relative;background:rgba(255,255,255,.88);border:1px solid rgba(181,217,241,.75);border-radius:30px;padding:clamp(22px,3vw,38px);box-shadow:0 20px 60px rgba(13,76,126,.09);backdrop-filter:blur(8px)}.recommend-section-header{align-items:flex-end}.recommend-section-kicker{display:inline-flex;align-items:center;gap:8px;background:#e8f6ff;color:#0877d1;border-radius:999px;padding:8px 13px;font-size:12px;font-weight:900;margin-bottom:10px}.province-tabs{display:flex;gap:10px;overflow-x:auto;margin:24px 0;padding:2px 2px 8px;scrollbar-width:thin}.province-tab{display:inline-flex;align-items:center;gap:8px;border:1px solid #d6e7f3;background:#fff;border-radius:999px;padding:11px 16px;white-space:nowrap;font-weight:800;color:#36536b;box-shadow:0 5px 16px rgba(34,77,111,.05);transition:.2s;cursor:pointer}.province-tab span{min-width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:#edf5fb;color:#52718a;font-size:11px}.province-tab:hover{transform:translateY(-2px);border-color:#85cbed}.province-tab.active{background:linear-gradient(135deg,#0877d1,#19bfe6);color:#fff;border-color:transparent;box-shadow:0 10px 24px rgba(8,119,209,.24)}.province-tab.active span{background:rgba(255,255,255,.2);color:#fff}.province-recommend-grid{display:none;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}.province-recommend-grid.active{display:grid}.recommend-property-card{min-width:0;background:#fff;border:1px solid #e0ecf5;border-radius:20px;overflow:hidden;box-shadow:0 10px 28px rgba(26,79,119,.08);transition:.25s}.recommend-property-card:hover{transform:translateY(-6px);box-shadow:0 18px 38px rgba(26,79,119,.15);border-color:#acd8ef}.recommend-property-image{display:block;position:relative;aspect-ratio:4/3;overflow:hidden;background:#eef6fb}.recommend-property-image>img{width:100%;height:100%;object-fit:cover;transition:.35s}.recommend-property-card:hover .recommend-property-image>img{transform:scale(1.06)}.recommend-property-label{position:absolute;left:10px;top:10px;z-index:3;display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:7px 10px;background:linear-gradient(135deg,#ffb000,#ff8900);color:#fff;font-size:11px;font-weight:900;box-shadow:0 8px 20px rgba(255,139,0,.3)}.recommend-property-image .property-badges{right:9px;top:9px}.recommend-property-image .property-badges .badge{font-size:10px;padding:6px 8px}.recommend-property-body{padding:15px}.recommend-property-type{font-size:11px;font-weight:900;color:#0a83cf;text-transform:uppercase;letter-spacing:.3px;margin-bottom:7px}.recommend-property-body h3{font-size:16px;line-height:1.4;margin:0 0 8px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.recommend-property-body h3 a{color:#14253a}.recommend-property-body p{margin:0 0 10px;color:#718197;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.recommend-property-body p i{color:#16a9dc}.recommend-property-price{font-size:16px;font-weight:900;color:#0877d1;margin-bottom:12px;line-height:1.35}.recommend-property-link{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #edf2f7;padding-top:11px;color:#0877d1;font-size:12px;font-weight:900}.recommend-property-link i{transition:.2s}.recommend-property-link:hover i{transform:translateX(4px)}
.recommendation-admin-page .admin-content{background:#f5f9fd}.recommend-admin-hero{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:28px;border-radius:24px;background:linear-gradient(135deg,#075fae,#16b9df);color:#fff;box-shadow:0 18px 46px rgba(8,102,177,.22);margin-bottom:18px}.recommend-admin-hero h1{margin:8px 0 4px;font-size:clamp(26px,3vw,38px)}.recommend-admin-hero p{margin:0;color:rgba(255,255,255,.82);max-width:760px}.recommend-admin-kicker{display:inline-flex;gap:8px;align-items:center;font-size:12px;font-weight:900;background:rgba(255,255,255,.16);padding:7px 12px;border-radius:999px}.recommend-admin-hero .btn-light{background:#fff;color:#0877d1;border:0;white-space:nowrap}.recommend-admin-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:18px}.recommend-stat-card{display:flex;align-items:center;gap:13px;padding:17px;background:#fff;border:1px solid #e0ebf4;border-radius:18px;box-shadow:0 8px 24px rgba(25,72,108,.06)}.recommend-stat-card>span{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;background:#e9f6ff;color:#0877d1;font-size:20px}.recommend-stat-card strong{display:block;font-size:24px;color:#17324d}.recommend-stat-card small{color:#73869a}.recommend-admin-panel{background:#fff;border:1px solid #e0ebf4;border-radius:24px;padding:24px;box-shadow:0 12px 34px rgba(25,72,108,.07);margin-bottom:20px}.recommend-panel-title{display:flex;gap:13px;align-items:center;margin-bottom:20px}.recommend-panel-title>div:first-child{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;background:linear-gradient(135deg,#0877d1,#19bfe6);color:#fff;font-size:18px}.recommend-panel-title h2,.recommend-list-head h2{margin:0;color:#17324d}.recommend-panel-title p,.recommend-list-head p{margin:4px 0 0;color:#7b8b9d;font-size:13px}.recommend-property-picker{margin-bottom:16px}.recommend-property-picker label{display:flex;align-items:center;gap:8px}.recommend-native-select{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important}.recommend-search-picker{position:relative}.recommend-search-picker-input{width:100%;min-height:48px;padding:0 42px 0 14px!important;border:1px solid #cfe0f1!important;border-radius:12px!important;background:#fff!important;color:#18324f!important;box-shadow:0 2px 8px rgba(30,91,143,.05)!important}.recommend-search-picker-input:focus{border-color:#1d9bf0!important;box-shadow:0 0 0 4px rgba(29,155,240,.13)!important;outline:0!important}.recommend-search-picker-chevron{position:absolute;top:50%;right:15px;color:#5f7892;pointer-events:none;transform:translateY(-50%);transition:transform .18s ease}.recommend-search-picker.is-open .recommend-search-picker-chevron{transform:translateY(-50%) rotate(180deg)}.recommend-search-picker-menu{position:absolute;z-index:40;top:calc(100% + 7px);right:0;left:0;display:none;max-height:290px;padding:7px;overflow-y:auto;border:1px solid #d5e3f1;border-radius:14px;background:#fff;box-shadow:0 18px 45px rgba(20,54,86,.18)}.recommend-search-picker.is-open .recommend-search-picker-menu{display:block}.recommend-search-picker-option{display:block;width:100%;padding:10px 12px;border:0;border-radius:9px;background:transparent;color:#17324f;cursor:pointer;text-align:left}.recommend-search-picker-option:hover,.recommend-search-picker-option.is-highlighted{background:#edf7ff;color:#0877d1}.recommend-search-picker-option.is-selected{background:#e1f2ff;color:#056bbd}.recommend-search-picker-option strong,.recommend-search-picker-option small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.recommend-search-picker-option strong{font-size:14px;line-height:1.35}.recommend-search-picker-option small{margin-top:3px;color:#71859b;font-size:12px}.recommend-search-picker-empty{padding:22px 12px;color:#7b8ea3;font-size:13px;text-align:center}.recommend-form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.recommend-form-actions{display:flex;justify-content:flex-end;margin-top:18px}.recommend-list-head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:18px}.recommend-count-pill{background:#edf7ff;color:#0877d1;padding:8px 12px;border-radius:999px;font-size:12px;font-weight:900}.recommend-admin-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.recommend-admin-item{display:grid;grid-template-columns:180px minmax(0,1fr);border:1px solid #e0ebf4;border-radius:18px;overflow:hidden;background:#fbfdff}.recommend-admin-item>img{width:100%;height:100%;min-height:220px;object-fit:cover}.recommend-admin-item-body{padding:17px;min-width:0}.recommend-admin-item-top{display:flex;justify-content:space-between;gap:8px;align-items:center}.status-chip,.sort-chip{display:inline-flex;border-radius:999px;padding:6px 9px;font-size:10px;font-weight:900}.status-chip.is-active{background:#e7f8ee;color:#198754}.status-chip.is-inactive{background:#f2f3f5;color:#6c757d}.sort-chip{background:#eef5fb;color:#627a90}.recommend-admin-item h3{margin:12px 0 6px;font-size:18px;color:#19334d}.recommend-admin-item p{margin:0 0 9px;color:#73869a;font-size:12px}.recommend-admin-price{display:block;color:#0877d1;font-size:16px;margin-bottom:12px}.recommend-admin-meta{display:grid;gap:6px;color:#5f7489;font-size:11px}.recommend-note{margin-top:10px;padding:9px 10px;background:#fff6db;color:#8b6500;border-radius:10px;font-size:11px}.recommend-delete-form{margin-top:13px;text-align:right}
@media(max-width:1280px){.province-recommend-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.recommend-admin-grid{grid-template-columns:1fr}}
@media(max-width:1050px){.province-recommend-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.recommend-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.recommend-section-shell{border-radius:22px;padding:18px}.recommend-section-header,.recommend-admin-hero,.recommend-list-head{align-items:flex-start;flex-direction:column}.province-recommend-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.recommend-property-body{padding:13px}.recommend-admin-stats{grid-template-columns:1fr}.recommend-form-grid{grid-template-columns:1fr}.recommend-form-actions .btn{width:100%}.recommend-admin-item{grid-template-columns:120px minmax(0,1fr)}.recommend-admin-item>img{min-height:240px}.recommend-admin-panel{padding:16px}}
@media(max-width:480px){.province-recommend-grid{grid-template-columns:1fr}.recommend-admin-item{grid-template-columns:1fr}.recommend-admin-item>img{height:190px;min-height:0}.recommend-admin-hero{padding:21px}.recommend-admin-hero .btn{width:100%}}


/* ===== Recommendation grid final fix 2026-07-10 ===== */
.province-recommend-section .province-recommend-grid{display:none!important;width:100%!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:16px!important;align-items:stretch!important}
.province-recommend-section .province-recommend-grid.active{display:grid!important}
.province-recommend-section .recommend-property-card{width:100%!important;min-width:0!important;max-width:none!important;margin:0!important;display:flex!important;flex-direction:column!important}
.province-recommend-section .recommend-property-image{width:100%!important;aspect-ratio:4/3!important}
.province-recommend-section .recommend-property-image img{width:100%!important;height:100%!important;object-fit:cover!important}
.province-recommend-section .recommend-property-body{display:flex!important;flex:1 1 auto!important;flex-direction:column!important;padding:14px!important}
.province-recommend-section .recommend-property-price{margin-top:auto!important}
@media(max-width:1280px){.province-recommend-section .province-recommend-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}}
@media(max-width:1050px){.province-recommend-section .province-recommend-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
@media(max-width:760px){.province-recommend-section .province-recommend-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:480px){.province-recommend-section .province-recommend-grid{grid-template-columns:1fr!important}}

/* ===== Home recommendation section: transparent background 2026-07-10 ===== */
.province-recommend-section{
    background:transparent !important;
    overflow:visible !important;
}
.province-recommend-section::before{
    display:none !important;
    content:none !important;
}
.province-recommend-section .recommend-section-shell{
    background:transparent !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    backdrop-filter:none !important;
    padding:0 !important;
}


/* Property detail gallery and information redesign */
.property-detail-page .detail-layout{align-items:start;gap:28px}
.property-detail-page .detail-main{min-width:0}
.property-gallery-card{padding:14px!important;overflow:hidden}
.property-gallery-stage{position:relative;overflow:hidden;border-radius:20px;background:#0f172a;aspect-ratio:16/9;cursor:zoom-in}
.property-gallery-stage>img{width:100%;height:100%;object-fit:cover;display:block;transition:opacity .18s ease,transform .35s ease}
.property-gallery-stage>img.is-changing{opacity:.35;transform:scale(1.015)}
.gallery-nav,.gallery-fullscreen-btn{position:absolute;z-index:4;border:0;color:#fff;background:rgba(15,23,42,.72);backdrop-filter:blur(10px);box-shadow:0 8px 24px rgba(15,23,42,.18);cursor:pointer;transition:.2s ease}
.gallery-nav{top:50%;transform:translateY(-50%);width:46px;height:46px;border-radius:50%;font-size:18px}
.gallery-nav:hover{background:#1677ff;transform:translateY(-50%) scale(1.06)}
.gallery-prev{left:16px}.gallery-next{right:16px}
.gallery-fullscreen-btn{right:16px;top:16px;border-radius:999px;padding:10px 14px;display:flex;gap:8px;align-items:center;font-weight:700}
.gallery-fullscreen-btn:hover{background:#1677ff}
.gallery-counter{position:absolute;z-index:4;left:16px;bottom:16px;color:#fff;background:rgba(15,23,42,.72);backdrop-filter:blur(10px);padding:7px 12px;border-radius:999px;font-size:13px;font-weight:800}
.gallery-watermark,.lightbox-watermark{position:absolute;z-index:3;right:18px;bottom:16px;color:rgba(255,255,255,.72);font-size:clamp(16px,2vw,28px);font-weight:900;letter-spacing:.02em;text-shadow:0 2px 10px rgba(0,0,0,.4);pointer-events:none;user-select:none}
.property-gallery-card .gallery-thumbs{display:flex;gap:10px;overflow-x:auto;padding:12px 2px 2px;scrollbar-width:thin}
.property-gallery-card .gallery-thumb{flex:0 0 92px;height:64px;border:3px solid transparent;border-radius:12px;padding:0;overflow:hidden;background:#fff;cursor:pointer;opacity:.72;transition:.2s ease}
.property-gallery-card .gallery-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.property-gallery-card .gallery-thumb.active{border-color:#1687f8;opacity:1;box-shadow:0 8px 18px rgba(22,135,248,.22)}
.property-gallery-card .gallery-thumb:hover{opacity:1;transform:translateY(-2px)}
.property-lightbox{position:fixed;inset:0;z-index:99999;background:rgba(2,6,23,.96);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:.22s ease;padding:24px}
.property-lightbox.is-open{opacity:1;visibility:visible}
body.lightbox-open{overflow:hidden}
.lightbox-figure{position:relative;margin:0;max-width:min(94vw,1500px);max-height:90vh;display:flex;align-items:center;justify-content:center}
.lightbox-figure img{display:block;max-width:100%;max-height:88vh;object-fit:contain;border-radius:12px;box-shadow:0 24px 80px rgba(0,0,0,.45)}
.lightbox-figure figcaption{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);background:rgba(15,23,42,.72);color:#fff;padding:7px 13px;border-radius:999px;font-weight:700}
.lightbox-close,.lightbox-nav{position:fixed;z-index:2;border:0;color:#fff;background:rgba(255,255,255,.13);backdrop-filter:blur(10px);cursor:pointer}
.lightbox-close{top:22px;right:22px;width:48px;height:48px;border-radius:50%;font-size:24px}
.lightbox-nav{top:50%;transform:translateY(-50%);width:54px;height:54px;border-radius:50%;font-size:21px}
.lightbox-prev{left:22px}.lightbox-next{right:22px}
.lightbox-close:hover,.lightbox-nav:hover{background:#1687f8}
.detail-section-heading{display:flex;gap:14px;align-items:center;margin-bottom:0;padding-bottom:20px;border-bottom:1px solid #e7edf5}
.detail-section-heading h2{margin:0;color:#0f274b;font-size:25px}
.detail-section-heading p{margin:5px 0 0;color:#718096}
.detail-section-icon{flex:0 0 48px;width:48px;height:48px;border:1px solid #cfe8ff;border-radius:50%;display:grid;place-items:center;color:#1687f8;font-size:20px;background:#f6fbff;box-shadow:0 7px 18px rgba(21,127,245,.08)}
.property-info-card{padding:26px!important}
.property-info-columns{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-top:12px}
.property-info-grid{display:grid;grid-template-columns:1fr;align-content:start;padding-right:28px}
.property-availability{display:inline-flex;align-items:center;gap:7px;margin-left:auto;padding:7px 12px;border:1px solid #bfead0;border-radius:999px;background:#ecf9f1;color:#17a75a;font-size:12px;font-weight:800;white-space:nowrap}
.property-info-item{display:flex;align-items:center;gap:13px;min-height:78px;padding:13px 4px;border:0;border-bottom:1px solid #e7edf5;border-radius:0;background:transparent;transition:.2s ease}
.property-info-item:last-child{border-bottom:0}
.property-info-item:hover{background:#f8fbff}
.property-info-item.is-price{background:transparent}
.property-info-icon{flex:0 0 36px;width:36px;height:36px;border:1px solid #dceeff;border-radius:50%;display:grid;place-items:center;color:#1687f8;background:#f8fcff;font-size:15px}
.property-info-item.is-price .property-info-icon{color:#1687f8;background:#f8fcff}
.property-info-item small{display:block;color:#718096;margin-bottom:5px;font-size:12px}
.property-info-item strong{display:block;color:#12233f;font-size:15px;line-height:1.45;word-break:break-word}
.property-extra-grid{display:grid;grid-template-columns:1fr;align-content:start;padding-left:28px;border-left:1px solid #e7edf5}
.property-extra-grid .property-info-item{min-height:66px;padding:9px 4px}
.property-detail-page .detail-card{border:1px solid #e8eef7;box-shadow:0 14px 38px rgba(26,62,103,.07);border-radius:22px}
.property-detail-page .detail-title{background:linear-gradient(135deg,#fff,#f7fbff)}
.property-detail-page .detail-price{color:#0b78e3}
.home-ad-section:has(.home-ad-shell:empty),.home-ad-shell:empty{display:none!important}
@media(max-width:760px){.property-info-columns{grid-template-columns:1fr}.property-info-grid{padding-right:0}.property-extra-grid{padding-left:0;border-left:0;border-top:1px solid #e7edf5}.property-info-primary .property-info-item:last-child{border-bottom:0}}
@media(max-width:640px){.property-gallery-card{padding:8px!important}.property-gallery-stage{border-radius:15px;aspect-ratio:4/3}.gallery-nav{width:40px;height:40px}.gallery-prev{left:8px}.gallery-next{right:8px}.gallery-fullscreen-btn{right:8px;top:8px;padding:9px}.gallery-fullscreen-btn span{display:none}.gallery-counter{left:8px;bottom:8px}.gallery-watermark{right:10px;bottom:10px;font-size:15px}.property-gallery-card .gallery-thumb{flex-basis:76px;height:54px}.property-info-card{padding:18px!important}.property-info-item{min-height:70px}.detail-section-heading{align-items:flex-start;flex-wrap:wrap}.detail-section-heading>div:nth-child(2){flex:1;min-width:0}.property-availability{margin-left:62px}.detail-section-heading h2{font-size:21px}.lightbox-nav{width:44px;height:44px}.lightbox-prev{left:8px}.lightbox-next{right:8px}.lightbox-close{top:12px;right:12px}}


/* Google Maps smart input */
.google-map-input-status{margin-top:10px;padding:10px 12px;border-radius:12px;font-size:.9rem;display:flex;align-items:center;gap:8px}
.google-map-input-status.is-success{background:#ecfdf5;color:#047857;border:1px solid #a7f3d0}
.google-map-input-status.is-warning{background:#fffbeb;color:#92400e;border:1px solid #fde68a}
.google-map-preview{margin-top:12px;border:1px solid #dbeafe;border-radius:16px;overflow:hidden;background:#f8fafc;box-shadow:0 8px 24px rgba(15,23,42,.08)}
.google-map-preview iframe{display:block;width:100%;height:300px;border:0}
.map-box iframe{display:block;width:100%;min-height:390px;border:0;border-radius:16px}
@media (max-width:767px){.google-map-preview iframe{height:240px}.map-box iframe{min-height:300px}}


/* =========================================================
   PROMOTIONS + AD PACKAGES v3.2.0
   ========================================================= */
.header-advertise-cta{display:inline-flex;align-items:center;gap:7px;padding:9px 12px;border-radius:999px;background:#eaf8f0;color:#0b8f45;font-weight:800;font-size:13px;white-space:nowrap;border:1px solid #c7ecd7}.header-advertise-cta:hover{background:#dff5e8;color:#08783a}.floating-line-ad{position:fixed;right:22px;bottom:86px;z-index:1040;display:flex;align-items:center;gap:10px;padding:11px 15px;border-radius:16px;background:#06c755;color:#fff!important;box-shadow:0 14px 34px rgba(6,199,85,.28);font-weight:800;line-height:1.15}.floating-line-ad i{font-size:27px}.floating-line-ad small{font-weight:600;opacity:.9}.promo-hero,.advertise-hero{padding:68px 0;background:linear-gradient(135deg,#0877d1,#0759ad 58%,#063f82);color:#fff;overflow:hidden}.promo-hero-inner{display:flex;align-items:center;justify-content:space-between;gap:28px}.promo-kicker,.advertise-hero span{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.15);font-weight:800}.promo-hero h1,.advertise-hero h1{font-size:clamp(38px,6vw,66px);margin:14px 0 10px;color:#fff}.promo-hero p,.advertise-hero p{max-width:760px;font-size:18px;color:rgba(255,255,255,.88)}.advertise-hero{text-align:center}.advertise-hero p{margin:0 auto 24px}.promo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.promo-card{background:#fff;border:1px solid #e5eef8;border-radius:22px;overflow:hidden;box-shadow:0 12px 32px rgba(18,73,124,.09);transition:.25s}.promo-card:hover{transform:translateY(-5px);box-shadow:0 18px 42px rgba(18,73,124,.15)}.promo-card-media{position:relative;display:block;aspect-ratio:16/10;background:#eef5fb;overflow:hidden}.promo-card-media img{width:100%;height:100%;object-fit:cover;transition:.35s}.promo-card:hover .promo-card-media img{transform:scale(1.04)}.promo-badge{position:absolute;left:14px;top:14px;padding:7px 11px;border-radius:999px;background:#ff6b35;color:#fff;font-size:13px;font-weight:900;box-shadow:0 8px 18px rgba(255,107,53,.25)}.promo-pin{position:absolute;right:14px;top:14px;width:36px;height:36px;display:grid;place-items:center;border-radius:50%;background:#fff;color:#0877d1}.promo-card-body{padding:20px}.promo-card-body h2{font-size:21px;margin:0 0 9px}.promo-card-body h2 a{color:#14324b}.promo-card-body>p{color:#607589;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.promo-location{font-size:14px;color:#0877d1!important}.promo-card-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:15px;margin-top:15px;border-top:1px solid #edf2f7;font-size:13px}.promo-card-foot a{font-weight:900}.promo-empty{grid-column:1/-1;text-align:center;padding:58px 25px;border:2px dashed #dce8f3;border-radius:24px;background:#f8fbfe}.promo-empty>i{font-size:44px;color:#7db7e5}.package-public-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;align-items:stretch}.package-public-card{position:relative;background:#fff;border:1px solid #e0eaf4;border-radius:24px;padding:26px;box-shadow:0 12px 30px rgba(21,73,119,.08);display:flex;flex-direction:column}.package-public-card.is-featured{border:2px solid #0877d1;transform:translateY(-8px)}.package-popular{position:absolute;right:18px;top:18px;background:#0877d1;color:#fff;padding:6px 10px;border-radius:999px;font-size:12px;font-weight:900}.package-icon{width:54px;height:54px;border-radius:16px;background:#eaf4fd;color:#0877d1;display:grid;place-items:center;font-size:23px}.package-public-card h2{font-size:21px;margin:18px 0 8px}.package-public-card>p{color:#65798c;min-height:66px}.package-price{display:flex;align-items:baseline;gap:7px;margin:14px 0 0}.package-price strong{font-size:38px;color:#0877d1}.package-period{color:#708397;font-size:14px;margin-bottom:16px}.package-public-card ul{padding:0;margin:0 0 22px;list-style:none;flex:1}.package-public-card li{display:flex;gap:9px;margin:9px 0;font-size:14px}.package-public-card li i{color:#15a85a;margin-top:3px}.btn-block{width:100%;justify-content:center}.promo-admin-hero,.package-admin-hero{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:28px;border-radius:24px;background:linear-gradient(135deg,#0877d1,#073f88);color:#fff;margin-bottom:22px}.promo-admin-hero span,.package-admin-hero span{font-weight:800;color:#bfe3ff}.promo-admin-hero h1,.package-admin-hero h1{color:#fff;margin:8px 0}.promo-admin-hero p,.package-admin-hero p{color:rgba(255,255,255,.82);margin:0}.admin-modern-panel{background:#fff;border:1px solid #e3ebf3;border-radius:22px;padding:24px;margin-bottom:22px;box-shadow:0 10px 26px rgba(24,73,114,.06)}.admin-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px}.admin-span-2{grid-column:1/-1}.admin-form-actions{display:flex;gap:10px}.switch-line{display:flex!important;align-items:center;gap:9px}.admin-image-preview{margin-top:12px;display:flex;align-items:center;gap:15px}.admin-image-preview img{width:150px;aspect-ratio:16/9;object-fit:cover;border-radius:12px}.admin-promo-grid,.admin-package-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.admin-promo-card,.admin-package-card{border:1px solid #e4ebf2;border-radius:18px;overflow:hidden;background:#fff}.admin-promo-thumb{position:relative;aspect-ratio:16/9;background:#edf4fa}.admin-promo-thumb img{width:100%;height:100%;object-fit:cover}.admin-promo-thumb span{position:absolute;left:10px;top:10px;background:#ff6b35;color:#fff;padding:5px 9px;border-radius:999px;font-size:12px;font-weight:800}.admin-promo-body,.admin-package-card{padding:18px}.admin-promo-body h3,.admin-package-card h3{margin:10px 0 6px}.admin-card-actions{display:flex;gap:8px;align-items:center;margin-top:14px}.admin-card-actions form{margin:0}.package-summary-row{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:22px}.package-summary-row>div{background:#fff;border:1px solid #e4edf5;border-radius:18px;padding:20px;display:flex;flex-direction:column}.package-summary-row strong{font-size:32px;color:#0877d1}.package-summary-row span{color:#6a7e90}.admin-package-card{position:relative}.admin-package-card.featured{border:2px solid #0877d1}.admin-package-icon{width:48px;height:48px;border-radius:14px;background:#eaf4fd;color:#0877d1;display:grid;place-items:center;font-size:20px}.admin-package-price{font-size:25px;font-weight:900;color:#0877d1}.admin-package-price small{font-size:12px;color:#74889a}.admin-package-card ul{padding:0;list-style:none}.admin-package-card li{display:flex;gap:7px;font-size:13px;margin:7px 0}.admin-package-card li i{color:#17a95a}
@media(max-width:1180px){.package-public-grid{grid-template-columns:repeat(2,1fr)}.admin-promo-grid,.admin-package-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:860px){.promo-grid{grid-template-columns:repeat(2,1fr)}.promo-hero-inner,.promo-admin-hero,.package-admin-hero{align-items:flex-start;flex-direction:column}.admin-form-grid{grid-template-columns:1fr}.admin-span-2{grid-column:auto}.package-summary-row{grid-template-columns:1fr 1fr}.header-advertise-cta span{display:none}}
@media(max-width:620px){.promo-grid,.package-public-grid,.admin-promo-grid,.admin-package-grid,.package-summary-row{grid-template-columns:1fr}.promo-hero,.advertise-hero{padding:48px 0}.promo-card-foot{align-items:flex-start;flex-direction:column}.floating-line-ad{right:14px;bottom:78px;padding:10px 12px}.floating-line-ad span{display:none}.floating-line-ad i{font-size:30px}.package-public-card.is-featured{transform:none}.admin-modern-panel{padding:17px}}


/* Header advertising CTA and compact LINE floating button - v3.2.1 */
.top-strip-inner {
    min-height: 38px;
}

.top-strip-left {
    display: flex;
    align-items: center;
}

.top-strip-advertise {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 30px;
    padding: 5px 12px;
    border: 1px solid rgba(255,255,255,.38);
    border-radius: 12px !important;
    color: #fff !important;
    background: rgba(255,255,255,.12);
    font-size: 12px;
    font-weight: 900;
    line-height: 1;
    text-decoration: none;
    transition: background .2s ease, transform .2s ease, border-color .2s ease;
}

.top-strip-advertise:hover {
    color: #fff !important;
    background: rgba(255,255,255,.23);
    border-color: rgba(255,255,255,.7);
    transform: translateY(-1px);
}

.top-strip-advertise i {
    font-size: 12px;
}

.header-actions {
    flex-shrink: 0;
}

.floating-line-ad {
    right: 22px;
    bottom: 84px;
    width: 54px;
    height: 54px;
    padding: 0;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #06c755;
    border: 3px solid #fff;
    box-shadow: 0 12px 30px rgba(6,199,85,.34);
    line-height: 1;
    overflow: hidden;
    transition: transform .2s ease, box-shadow .2s ease;
}

.floating-line-ad:hover {
    transform: translateY(-3px) scale(1.04);
    box-shadow: 0 16px 36px rgba(6,199,85,.42);
}

.floating-line-ad i {
    margin: 0;
    font-size: 31px;
    line-height: 1;
}

@media (max-width: 1120px) {
    .main-header-inner {
        gap: 14px;
    }

    .main-nav {
        gap: 3px;
    }

    .main-nav > a {
        padding-left: 9px;
        padding-right: 9px;
        font-size: 13px;
    }
}

@media (max-width: 767px) {
    .top-strip-inner {
        display: flex;
        gap: 10px;
        justify-content: space-between;
    }

    .top-strip-left,
    .top-strip-right {
        width: auto;
    }

    .top-strip-right a:first-child {
        display: none;
    }

    .top-strip-advertise {
        padding: 5px 9px;
        font-size: 11px;
    }

    .floating-line-ad {
        right: 14px;
        bottom: 76px;
        width: 50px;
        height: 50px;
    }

    .floating-line-ad i {
        font-size: 29px;
    }
}


/* v3.3.0 Navbar fit, package toggle and pricing tiers */
.main-header-inner{gap:12px!important}.site-logo.site-brand-demo{max-width:250px}.site-logo.site-brand-demo img{width:250px!important;height:58px!important;max-width:100%;object-fit:contain}.main-nav{min-width:0;flex:1;justify-content:center;margin-left:0!important;gap:1px!important}.main-nav a{white-space:nowrap;padding:9px 8px!important;font-size:13px!important}.header-actions{gap:6px!important}.header-actions .btn{padding:9px 13px!important;font-size:13px!important;white-space:nowrap}
@media(max-width:1180px){.site-logo.site-brand-demo{max-width:215px}.site-logo.site-brand-demo img{width:215px!important}.main-nav a{padding:8px 6px!important;font-size:12px!important}.header-actions .btn{padding:8px 10px!important;font-size:12px!important}}
@media(max-width:1020px){.nav-toggle{display:block!important;margin-left:auto}.main-nav{position:absolute!important;top:100%;left:12px;right:12px;width:auto!important;display:none!important;flex-direction:column;align-items:stretch;background:#fff;padding:12px;border:1px solid var(--border);border-radius:18px;box-shadow:0 18px 45px rgba(15,45,75,.16);z-index:1000}.main-nav.open{display:flex!important}.main-nav a{font-size:14px!important;padding:11px 14px!important}.header-actions{margin-left:0}.main-header-inner{position:relative}}
@media(max-width:640px){.site-logo.site-brand-demo{max-width:200px}.site-logo.site-brand-demo img{width:200px!important;height:50px!important}}
.feature-toggle-card{display:flex;align-items:flex-start;gap:14px;padding:18px;border:1px solid #dbe8f5;border-radius:18px;background:linear-gradient(135deg,#f8fcff,#eef8ff);cursor:pointer}.feature-toggle-card>input{position:absolute;opacity:0}.feature-toggle-ui{width:52px;height:30px;border-radius:999px;background:#cbd5e1;position:relative;flex:0 0 52px;transition:.2s}.feature-toggle-ui:after{content:"";position:absolute;width:24px;height:24px;border-radius:50%;background:#fff;top:3px;left:3px;box-shadow:0 3px 10px rgba(0,0,0,.2);transition:.2s}.feature-toggle-card input:checked+.feature-toggle-ui{background:linear-gradient(135deg,#0ea5e9,#2563eb)}.feature-toggle-card input:checked+.feature-toggle-ui:after{transform:translateX(22px)}.feature-toggle-card strong,.feature-toggle-card small{display:block}.feature-toggle-card small{margin-top:4px;color:#64748b;line-height:1.55}
.package-image-upload{position:relative;border:2px dashed #b8d8ee;border-radius:18px;background:#f5fbff;padding:24px;text-align:center}.package-image-upload input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.package-image-upload span{display:flex;flex-direction:column;gap:8px;align-items:center;font-weight:800;color:#1769aa}.package-image-upload i{font-size:30px}.package-image-preview{margin-top:12px;display:flex;align-items:center;gap:14px}.package-image-preview img{width:180px;height:100px;object-fit:cover;border-radius:14px;border:1px solid #dce8f2}.tier-editor-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;margin-bottom:12px}.tier-editor-heading label,.tier-editor-heading small{display:block}.tier-editor{display:grid;gap:10px}.tier-row{display:grid;grid-template-columns:110px minmax(150px,1fr) 120px minmax(130px,.7fr) 42px;gap:10px;align-items:end;padding:12px;border:1px solid #dbe8f5;border-radius:15px;background:#f9fcff}.tier-row label{font-size:12px}.tier-monthly{height:45px;padding:7px 10px;border-radius:10px;background:#eaf6ff}.tier-monthly span,.tier-monthly strong{display:block}.tier-monthly span{font-size:11px;color:#64748b}.tier-monthly strong{color:#0877d1}.tier-remove{height:42px;border:0;border-radius:10px;background:#fff0f0;color:#dc2626;cursor:pointer}.admin-package-cover,.package-cover{overflow:hidden;border-radius:16px;background:#eef6fb}.admin-package-cover img{width:100%;height:150px;object-fit:cover}.package-cover{margin:-22px -22px 18px}.package-cover img{width:100%;height:180px;object-fit:cover}.admin-tier-summary{display:grid;gap:5px;margin:10px 0}.admin-tier-summary span{font-size:12px;padding:7px 9px;border-radius:8px;background:#eff8ff;color:#175f98}.package-tier-table-wrap{overflow-x:auto;margin:14px 0}.package-tier-table{width:100%;border-collapse:collapse;font-size:12px;min-width:420px}.package-tier-table th,.package-tier-table td{padding:9px 8px;border-bottom:1px solid #e2edf5;text-align:left}.package-tier-table th{background:#edf7ff;color:#145d93}.package-tier-table td:last-child{color:#dc2626;font-weight:800}
@media(max-width:760px){.tier-row{grid-template-columns:1fr 1fr}.tier-monthly{grid-column:1/-1}.tier-remove{position:absolute;right:12px;margin-top:-4px}.tier-row{position:relative;padding-top:42px}.package-image-preview{align-items:flex-start;flex-direction:column}.package-image-preview img{width:100%;height:auto}.tier-editor-heading{align-items:flex-start;flex-direction:column}}


/* ===== Admin Ads Navigation Group v3.4.0 ===== */
.admin-nav-group{margin:4px 0;border-radius:14px;overflow:hidden}
.admin-nav-group>summary{list-style:none;display:flex;align-items:center;gap:12px;padding:12px 14px;color:#dbeafe;font-weight:800;cursor:pointer;border-radius:12px;user-select:none;transition:.2s ease}
.admin-nav-group>summary::-webkit-details-marker{display:none}
.admin-nav-group>summary:hover,.admin-nav-group[open]>summary{background:rgba(255,255,255,.10);color:#fff}
.admin-nav-group>summary>i:first-child{width:22px;text-align:center;color:#7dd3fc}
.admin-nav-group>summary .admin-nav-chevron{margin-left:auto;font-size:12px;transition:transform .2s ease}
.admin-nav-group[open]>summary .admin-nav-chevron{transform:rotate(180deg)}
.admin-nav-submenu{display:grid;gap:4px;padding:5px 0 8px 16px}
.admin-nav-submenu a{position:relative;padding:10px 12px!important;font-size:13px!important;border-left:2px solid rgba(125,211,252,.22);border-radius:0 10px 10px 0!important}
.admin-nav-submenu a i{font-size:13px!important;width:18px!important}
.admin-nav-submenu a.active{border-left-color:#38bdf8;background:rgba(56,189,248,.16)!important}

/* ===== Public Package Pricing v3.4.0 ===== */
.package-tier-list{display:grid;gap:9px;margin:16px 0 18px}
.package-tier-item{display:grid;grid-template-columns:minmax(72px,.8fr) minmax(96px,1fr) minmax(98px,1fr) auto;gap:8px;align-items:center;padding:11px 12px;border:1px solid #dceaf6;border-radius:13px;background:linear-gradient(135deg,#f8fcff,#eef8ff)}
.package-tier-item.is-best{border-color:#72bfff;background:linear-gradient(135deg,#eff9ff,#e4f4ff);box-shadow:0 7px 18px rgba(14,116,189,.09)}
.package-tier-cell{min-width:0}
.package-tier-cell small{display:block;color:#718096;font-size:10px;margin-bottom:2px}
.package-tier-cell strong{display:block;color:#102a43;font-size:13px;line-height:1.25;white-space:nowrap}
.package-tier-cell.monthly strong{color:#0877d1}
.package-discount-badge{display:inline-flex;align-items:center;justify-content:center;min-width:48px;padding:6px 8px;border-radius:999px;background:#dcfce7;color:#15803d;font-size:11px;font-weight:900;white-space:nowrap}
.package-discount-badge.no-discount{background:#edf2f7;color:#718096}
.package-public-card{min-width:0}
.package-public-grid{align-items:start}
@media(max-width:1240px){.package-public-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
@media(max-width:900px){.package-public-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:620px){.package-public-grid{grid-template-columns:1fr!important}.package-tier-item{grid-template-columns:1fr 1fr}.package-discount-badge{justify-self:start}.package-public-card{padding:18px!important}}

/* =========================================================
   Advertise page V3: top package submenu + large price tables
   ========================================================= */
.package-top-nav {
    position: sticky;
    top: 0;
    z-index: 1015;
    background: rgba(255, 255, 255, .96);
    border-bottom: 1px solid #dce8f3;
    box-shadow: 0 8px 24px rgba(21, 73, 119, .08);
    backdrop-filter: blur(14px);
}
.package-top-nav-inner {
    min-height: 76px;
    display: flex;
    align-items: center;
    gap: 18px;
}
.package-top-nav-label {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: #153a5c;
    font-weight: 900;
    white-space: nowrap;
}
.package-top-nav-label i { color: #0877d1; }
.package-top-nav-links {
    min-width: 0;
    flex: 1;
    display: flex;
    align-items: center;
    gap: 10px;
    overflow-x: auto;
    padding: 10px 2px;
    scrollbar-width: thin;
}
.package-top-nav-link {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 43px;
    padding: 9px 15px;
    border: 1px solid #dce8f3;
    border-radius: 999px;
    color: #39556e;
    background: #fff;
    font-weight: 800;
    font-size: 14px;
    white-space: nowrap;
    transition: .2s ease;
}
.package-top-nav-link:hover,
.package-top-nav-link.is-active {
    color: #fff;
    background: linear-gradient(135deg, #1497e5, #0877d1);
    border-color: #0877d1;
    box-shadow: 0 9px 22px rgba(8, 119, 209, .22);
    transform: translateY(-1px);
}
.advertise-packages-section { background: #f6f9fc; }
.package-table-list {
    display: grid;
    gap: 32px;
}
.package-table-card {
    position: relative;
    scroll-margin-top: 104px;
    overflow: hidden;
    background: #fff;
    border: 1px solid #dce8f3;
    border-radius: 28px;
    box-shadow: 0 18px 46px rgba(20, 67, 108, .09);
}
.package-table-card.is-featured {
    border: 2px solid #0877d1;
    box-shadow: 0 22px 52px rgba(8, 119, 209, .15);
}
.package-recommended-ribbon {
    position: absolute;
    z-index: 2;
    right: 22px;
    top: 20px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 13px;
    border-radius: 999px;
    color: #fff;
    background: linear-gradient(135deg, #ff9f1c, #ff6b00);
    box-shadow: 0 10px 22px rgba(255, 107, 0, .25);
    font-size: 13px;
    font-weight: 900;
}
.package-table-card-head {
    display: grid;
    grid-template-columns: minmax(300px, 420px) minmax(0, 1fr);
    gap: 30px;
    padding: 30px;
    border-bottom: 1px solid #e7eef5;
}
.package-table-visual {
    min-height: 250px;
    overflow: hidden;
    border-radius: 22px;
    background: linear-gradient(145deg, #eef7ff, #e5f1fb);
}
.package-table-visual img {
    width: 100%;
    height: 100%;
    min-height: 250px;
    object-fit: cover;
}
.package-table-icon {
    min-height: 250px;
    display: grid;
    place-items: center;
    color: #0877d1;
    font-size: 78px;
}
.package-table-summary { min-width: 0; }
.package-table-title-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 22px;
    padding-right: 0;
}
.package-code-badge {
    display: inline-flex;
    padding: 6px 10px;
    margin-bottom: 9px;
    border-radius: 999px;
    background: #eaf5ff;
    color: #0877d1;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .04em;
}
.package-table-summary h2 {
    margin: 0;
    color: #0f2f4d;
    font-size: clamp(27px, 3vw, 40px);
    line-height: 1.2;
}
.package-start-price {
    flex: 0 0 auto;
    min-width: 155px;
    padding: 15px 18px;
    border-radius: 18px;
    background: #f0f8ff;
    text-align: right;
}
.package-start-price small {
    display: block;
    color: #6a8196;
    font-weight: 700;
}
.package-start-price strong {
    color: #0877d1;
    font-size: 34px;
    line-height: 1;
}
.package-start-price span {
    margin-left: 4px;
    color: #35526c;
    font-weight: 800;
}
.package-table-description {
    margin: 18px 0;
    color: #60788d;
    font-size: 16px;
    line-height: 1.8;
}
.package-placement {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin-bottom: 18px;
    color: #315873;
    font-weight: 700;
}
.package-placement i { margin-top: 4px; color: #0877d1; }
.package-feature-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 18px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.package-feature-grid li {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    color: #324f68;
    line-height: 1.55;
}
.package-feature-grid i {
    margin-top: 4px;
    color: #14a958;
}
.package-pricing-panel { padding: 28px 30px 30px; }
.package-pricing-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 22px;
    margin-bottom: 18px;
}
.package-pricing-heading span {
    color: #0877d1;
    font-weight: 900;
}
.package-pricing-heading h3 {
    margin: 4px 0 0;
    color: #102f4a;
    font-size: 24px;
}
.package-pricing-heading p {
    margin: 0;
    color: #6a7f91;
    text-align: right;
}
.package-price-table-wrap {
    width: 100%;
    overflow-x: auto;
    border: 1px solid #dce8f3;
    border-radius: 18px;
}
.package-price-table {
    width: 100%;
    min-width: 840px;
    border-collapse: separate;
    border-spacing: 0;
    background: #fff;
}
.package-price-table th,
.package-price-table td {
    padding: 17px 18px;
    border-bottom: 1px solid #e5edf5;
    text-align: left;
    vertical-align: middle;
}
.package-price-table th {
    color: #225376;
    background: #edf7ff;
    font-size: 14px;
    font-weight: 900;
}
.package-price-table tbody tr:last-child td { border-bottom: 0; }
.package-price-table tbody tr { transition: .18s ease; }
.package-price-table tbody tr:hover { background: #f8fbfe; }
.package-price-table tbody tr.is-best-value {
    background: linear-gradient(90deg, #fff9e9, #fffdf7);
}
.package-price-table td > strong { color: #173a56; }
.price-total { font-size: 17px; }
.price-monthly { color: #0877d1 !important; font-size: 19px; }
.package-price-table td small { color: #718599; }
.best-value-badge,
.discount-pill,
.normal-price-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 900;
    white-space: nowrap;
}
.best-value-badge {
    margin-left: 8px;
    color: #8a5800;
    background: #ffefbd;
}
.discount-pill {
    color: #08753a;
    background: #ddf7e8;
}
.normal-price-pill {
    color: #64788a;
    background: #eef2f6;
}
.package-price-action-col { text-align: right !important; }
.package-tier-cta { white-space: nowrap; }
.package-no-tier {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 18px;
    border-radius: 15px;
    color: #536d82;
    background: #f4f8fb;
}
.package-table-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    padding: 24px 30px;
    border-top: 1px solid #e5edf5;
    background: #fbfdff;
}
.package-table-footer > div {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.package-table-footer strong {
    color: #123653;
    font-size: 18px;
}
.package-table-footer span { color: #698095; }

@media (max-width: 1000px) {
    .package-table-card-head { grid-template-columns: 320px minmax(0, 1fr); }
    .package-table-title-row { flex-direction: column; }
    .package-start-price { width: 100%; text-align: left; }
    .package-pricing-heading { align-items: flex-start; flex-direction: column; }
    .package-pricing-heading p { text-align: left; }
}

@media (max-width: 760px) {
    .package-top-nav-inner {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px;
        padding: 10px 0;
    }
    .package-top-nav-links { width: 100%; }
    .package-table-card-head { grid-template-columns: 1fr; padding: 20px; }
    .package-table-visual,
    .package-table-visual img,
    .package-table-icon { min-height: 210px; }
    .package-feature-grid { grid-template-columns: 1fr; }
    .package-pricing-panel { padding: 22px 20px; }
    .package-table-footer {
        align-items: stretch;
        flex-direction: column;
        padding: 20px;
    }
    .package-table-footer .btn { width: 100%; justify-content: center; }
    .package-recommended-ribbon { right: 14px; top: 14px; }
}

@media (max-width: 620px) {
    .package-price-table-wrap {
        overflow: visible;
        border: 0;
        border-radius: 0;
    }
    .package-price-table,
    .package-price-table thead,
    .package-price-table tbody,
    .package-price-table tr,
    .package-price-table th,
    .package-price-table td {
        display: block;
        width: 100%;
        min-width: 0;
    }
    .package-price-table thead { display: none; }
    .package-price-table tbody {
        display: grid;
        gap: 13px;
    }
    .package-price-table tbody tr {
        padding: 15px;
        border: 1px solid #dce8f3;
        border-radius: 16px;
        background: #fff;
    }
    .package-price-table tbody tr.is-best-value {
        border-color: #f0c75e;
        background: #fffaf0;
    }
    .package-price-table td {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 14px;
        padding: 9px 0;
        border-bottom: 1px dashed #e2eaf1;
        text-align: right !important;
    }
    .package-price-table td:last-child { border-bottom: 0; }
    .package-price-table td::before {
        content: attr(data-label);
        color: #667d91;
        font-size: 13px;
        font-weight: 800;
        text-align: left;
    }
    .package-price-action-col { display: block !important; }
    .package-price-action-col::before { display: none; }
    .package-tier-cta { width: 100%; justify-content: center; }
    .best-value-badge { margin-left: 4px; }
}
.home-page .hero-stats {
    display: none !important;
}

/* About page */
.about-page{background:#fff}.about-hero{position:relative;overflow:hidden;border-bottom:1px solid #dbeaf7;background:radial-gradient(circle at 88% 12%,rgba(56,189,248,.18),transparent 25%),linear-gradient(115deg,#f8fcff 0%,#eef8ff 52%,#f8fcff 100%)}.about-hero::before{content:"";position:absolute;left:-100px;bottom:-170px;width:360px;height:360px;border-radius:50%;background:rgba(186,230,253,.28)}.about-hero-inner{position:relative;min-height:550px;display:grid;grid-template-columns:minmax(0,1fr) minmax(440px,.9fr);gap:64px;align-items:center;padding-top:64px;padding-bottom:66px}.about-hero-copy{position:relative;z-index:2}.about-eyebrow,.about-section-kicker{display:inline-flex;align-items:center;gap:8px;color:#0877d1;font-size:13px;font-weight:900;letter-spacing:.02em}.about-eyebrow{padding:8px 13px;border:1px solid #cce7fa;border-radius:999px;background:rgba(255,255,255,.86)}.about-hero h1{margin:17px 0;color:#102d4a;font-size:clamp(42px,5.4vw,68px);line-height:1.12;letter-spacing:-.055em}.about-hero h1 span{color:#0877d1}.about-hero-copy>p{max-width:670px;margin:0;color:#5f7589;font-size:18px;line-height:1.85}.about-hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}.about-hero-actions .btn{min-height:51px;padding-inline:22px}.about-hero-visual{position:relative;min-height:400px}.about-hero-image{position:absolute;inset:20px 0 20px 30px;overflow:hidden;border:9px solid rgba(255,255,255,.9);border-radius:32px;background:#dff2ff;box-shadow:0 28px 65px rgba(25,93,142,.18);transform:rotate(1.5deg)}.about-hero-image img{width:100%;height:100%;object-fit:cover}.about-float-card{position:absolute;z-index:2;display:flex;align-items:center;gap:11px;padding:12px 15px;border:1px solid rgba(215,231,243,.85);border-radius:15px;background:rgba(255,255,255,.94);box-shadow:0 13px 30px rgba(25,76,116,.16);backdrop-filter:blur(9px)}.about-float-card>i{width:40px;height:40px;display:grid;place-items:center;border-radius:12px;background:#e6f5ff;color:#0877d1;font-size:17px}.about-float-card small,.about-float-card strong{display:block}.about-float-card small{color:#8294a5;font-size:10px}.about-float-card strong{margin-top:2px;color:#173650;font-size:13px}.about-float-search{left:0;top:12px}.about-float-connect{right:-18px;bottom:7px}.about-float-connect>i{background:#e9fbf3;color:#16a164}.about-story-section{padding-top:90px;padding-bottom:90px}.about-story-grid{display:grid;grid-template-columns:minmax(340px,.75fr) minmax(0,1fr);gap:85px;align-items:center}.about-story-visual{position:relative;min-height:390px;border:1px solid #dbeaf7;border-radius:38% 62% 55% 45%/52% 42% 58% 48%;background:linear-gradient(145deg,#eff9ff,#dcefff);box-shadow:inset 0 0 0 14px rgba(255,255,255,.5)}.about-story-home{position:absolute;inset:50% auto auto 50%;width:150px;height:150px;display:grid;place-items:center;border-radius:42px;background:linear-gradient(145deg,#fff,#e9f5fc);color:#0877d1;font-size:68px;box-shadow:0 24px 45px rgba(20,103,161,.17);transform:translate(-50%,-50%) rotate(-3deg)}.about-story-orbit{position:absolute;width:62px;height:62px;display:grid;place-items:center;border:7px solid rgba(255,255,255,.75);border-radius:50%;color:#fff;font-size:23px;box-shadow:0 12px 25px rgba(34,96,140,.16)}.orbit-one{left:13%;top:12%;background:#0ea5e9}.orbit-two{right:10%;top:23%;background:#27bf8a}.orbit-three{left:17%;bottom:8%;background:#3978e8}.about-story-copy h2,.about-section-heading h2{margin:9px 0 16px;color:#132f4b;font-size:clamp(30px,4vw,45px);line-height:1.25;letter-spacing:-.04em}.about-story-copy>p{margin:0 0 14px;color:#61778b;line-height:1.85}.about-story-copy blockquote{display:flex;gap:14px;margin:26px 0 0;padding:19px 22px;border-left:4px solid #0ea5e9;border-radius:0 16px 16px 0;background:#f1f9ff;color:#31556f;font-weight:800;line-height:1.7}.about-story-copy blockquote i{margin-top:4px;color:#49b8eb}.about-values-section{background:#f7fbfe}.about-section-heading{max-width:760px;margin:0 auto 36px;text-align:center}.about-section-heading>p{margin:0;color:#708498}.about-value-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.about-value-card{position:relative;overflow:hidden;padding:30px 28px;border:1px solid #deebf5;border-radius:22px;background:#fff;box-shadow:0 12px 32px rgba(26,78,117,.06);transition:.25s ease}.about-value-card::after{content:"";position:absolute;right:-38px;top:-38px;width:110px;height:110px;border-radius:50%;background:#f1f9ff}.about-value-card:hover{transform:translateY(-5px);box-shadow:0 18px 40px rgba(25,90,137,.12)}.about-value-icon{position:relative;z-index:1;width:57px;height:57px;display:grid;place-items:center;margin-bottom:20px;border-radius:17px;font-size:23px}.icon-blue{background:#e6f4ff;color:#0877d1}.icon-cyan{background:#e6fbff;color:#07a8c4}.icon-green{background:#e9fbf2;color:#159861}.about-value-card h3{margin:0 0 9px;color:#17344f;font-size:21px}.about-value-card p{margin:0;color:#6b7f91;line-height:1.75}.about-audience-section{padding-top:90px;padding-bottom:100px}.about-section-heading-left{max-width:none;margin:0 0 30px;text-align:left}.about-audience-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.about-audience-card{position:relative;min-height:345px;display:flex;overflow:hidden;padding:35px;border:1px solid #dcebf6;border-radius:26px}.seeker-card{background:linear-gradient(135deg,#f3faff,#e3f3ff)}.owner-card{background:linear-gradient(135deg,#f2fbf8,#e3f7ef)}.about-audience-content{position:relative;z-index:2;max-width:72%}.about-audience-label{display:inline-flex;align-items:center;gap:8px;color:#0877d1;font-size:13px;font-weight:900}.owner-card .about-audience-label{color:#16865c}.about-audience-card h3{margin:13px 0 17px;color:#16334d;font-size:25px;line-height:1.35}.about-audience-card ul{display:grid;gap:10px;margin:0 0 23px;padding:0;list-style:none}.about-audience-card li{display:flex;gap:9px;color:#536d81;font-size:14px}.about-audience-card li i{margin-top:4px;color:#18a66d}.about-audience-card a{display:inline-flex;align-items:center;gap:9px;color:#0877d1;font-weight:900}.owner-card a{color:#138158}.about-audience-art{position:absolute;right:-24px;bottom:-28px;width:205px;height:205px;display:grid;place-items:center;border-radius:50%;background:rgba(255,255,255,.6);color:rgba(8,119,209,.75);font-size:78px}.owner-card .about-audience-art{color:rgba(23,147,99,.72)}.about-cta-section{padding:0 0 90px}.about-cta-card{position:relative;overflow:hidden;min-height:355px;display:grid;place-items:center;padding:55px 30px;border-radius:30px;background:linear-gradient(125deg,#075fb5,#0b8fde 56%,#15b5d0);box-shadow:0 22px 52px rgba(8,119,209,.24);text-align:center}.about-cta-card::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 30%,rgba(255,255,255,.13),transparent 25%),radial-gradient(circle at 86% 68%,rgba(255,255,255,.12),transparent 22%)}.about-cta-copy{position:relative;z-index:2;color:#fff}.about-cta-copy>span{font-size:13px;font-weight:900;letter-spacing:.08em}.about-cta-copy h2{margin:10px 0;color:#fff;font-size:clamp(30px,4vw,44px);line-height:1.3}.about-cta-copy p{margin:0;color:#d9f3ff}.about-cta-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:11px;margin-top:26px}.about-cta-actions .btn{min-height:48px;padding:11px 20px;border-radius:12px}.about-cta-primary{background:#fff;color:#0877d1}.about-cta-secondary{border:1px solid rgba(255,255,255,.55);background:rgba(255,255,255,.11);color:#fff}.about-cta-decoration{position:absolute;z-index:1;color:rgba(255,255,255,.13)}.decoration-left{left:7%;bottom:-22px;font-size:130px;transform:rotate(-10deg)}.decoration-right{right:5%;top:32px;font-size:112px;transform:rotate(8deg)}
@media(max-width:1000px){.about-hero-inner{grid-template-columns:1fr;gap:25px;padding-top:50px}.about-hero-copy{max-width:760px}.about-hero-visual{min-height:390px;max-width:690px;width:100%;margin:auto}.about-story-grid{gap:48px}.about-audience-content{max-width:78%}.about-audience-art{opacity:.55}}
@media(max-width:800px){.about-story-grid{grid-template-columns:1fr}.about-story-visual{min-height:330px;max-width:500px;width:100%;margin:auto}.about-value-grid,.about-audience-grid{grid-template-columns:1fr}.about-audience-card{min-height:320px}}
@media(max-width:620px){.about-hero-inner{min-height:0;padding-top:36px;padding-bottom:42px}.about-hero h1{font-size:39px}.about-hero-copy>p{font-size:16px}.about-hero-actions{display:grid;grid-template-columns:1fr}.about-hero-actions .btn{justify-content:center}.about-hero-visual{min-height:265px}.about-hero-image{inset:8px 5px 15px 5px;border-width:6px;border-radius:22px}.about-float-card{padding:9px 11px}.about-float-card>i{width:34px;height:34px}.about-float-card strong{font-size:11px}.about-float-search{left:-2px;top:-3px}.about-float-connect{right:-3px;bottom:2px}.about-story-section,.about-audience-section{padding-top:58px;padding-bottom:58px}.about-story-visual{min-height:280px}.about-story-home{width:116px;height:116px;border-radius:32px;font-size:51px}.about-story-orbit{width:52px;height:52px;font-size:19px}.about-story-copy h2,.about-section-heading h2{font-size:30px}.about-values-section{padding-top:58px;padding-bottom:58px}.about-value-grid{gap:13px}.about-value-card{padding:23px 20px}.about-audience-card{min-height:0;padding:26px 21px 175px}.about-audience-content{max-width:100%}.about-audience-art{right:50%;bottom:-55px;transform:translateX(50%)}.about-cta-section{padding-bottom:58px}.about-cta-card{min-height:0;padding:45px 18px;border-radius:22px}.about-cta-copy h2 br{display:none}.about-cta-actions{display:grid}.decoration-left,.decoration-right{font-size:80px;opacity:.7}}
/* Contact page redesign */
.contact-page{background:#fbfdff}.contact-hero{overflow:hidden;border-bottom:1px solid #dceaf7;background:linear-gradient(105deg,#f4faff,#e9f6ff 56%,#f4faff)}.contact-hero-inner{min-height:225px;display:flex;align-items:center;justify-content:space-between;gap:40px}.contact-hero-copy{position:relative;z-index:2}.contact-eyebrow{display:inline-flex;align-items:center;gap:7px;color:#1487d8;font-size:13px;font-weight:800}.contact-hero h1{margin:5px 0 7px;color:#102d55;font-size:clamp(38px,5vw,56px);line-height:1.1;letter-spacing:-.04em}.contact-hero p{margin:0;color:#536b84;font-size:16px;line-height:1.8}.contact-hero-art{position:relative;width:360px;height:190px;flex:0 0 360px}.contact-envelope,.contact-paper-plane,.contact-chat-bubble{position:absolute;display:grid;place-items:center;filter:drop-shadow(0 12px 13px rgba(25,126,213,.2))}.contact-envelope{right:60px;bottom:24px;width:112px;height:76px;border-radius:12px;background:linear-gradient(145deg,#34b7f1,#0877e6);color:#fff;font-size:48px;transform:rotate(3deg)}.contact-paper-plane{left:68px;top:42px;color:#0877e6;font-size:52px;transform:rotate(-12deg)}.contact-chat-bubble{right:54px;top:8px;width:88px;height:58px;border:1px solid #d9eafb;border-radius:28px;background:#fff;color:#0877e6;font-size:25px}.contact-content-section{padding-top:42px}.contact-layout{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(310px,.75fr);gap:30px;align-items:start}.contact-form-card,.contact-channels-card{border:1px solid #dfe9f3;border-radius:18px;background:#fff;box-shadow:0 12px 36px rgba(26,72,112,.06)}.contact-form-card{padding:30px}.contact-card-heading{display:flex;align-items:center;gap:14px;margin-bottom:25px}.contact-heading-icon{width:50px;height:50px;display:grid;place-items:center;flex:0 0 auto;border-radius:14px;background:#e9f6ff;color:#0877d1;font-size:21px}.contact-card-heading h2,.contact-channels-card h2{margin:0;color:#17304f;font-size:23px}.contact-card-heading p{margin:4px 0 0;color:#8192a5;font-size:13px}.contact-page .form-group label{color:#263c57;font-weight:800}.contact-page .form-group input,.contact-page .form-group textarea{border-color:#d7e3ef;border-radius:10px;background:#fff}.contact-page .form-group input{height:48px}.contact-page .form-group input:focus,.contact-page .form-group textarea:focus{border-color:#2099e7;box-shadow:0 0 0 3px rgba(32,153,231,.1)}.contact-message-field{position:relative}.contact-character-count{position:absolute;right:12px;bottom:10px;color:#8da0b4;font-size:12px}.contact-submit{width:100%;min-height:50px;justify-content:center;border-radius:10px!important;background:linear-gradient(100deg,#0ba7ee,#1855e9);box-shadow:0 10px 22px rgba(20,109,226,.2)}.contact-privacy-note{margin:-4px 0 0!important;text-align:center;color:#91a0b1;font-size:12px}.contact-privacy-note i{margin-right:7px}.contact-channels-card{padding:24px;background:linear-gradient(145deg,#f8fcff,#eef7ff)}.contact-channels-card h2{margin-bottom:16px;font-size:19px}.contact-page .contact-list{display:grid;gap:9px;margin:0;padding:0}.contact-page .contact-list li{position:relative;display:flex;align-items:center;gap:13px;min-height:70px;padding:12px 38px 12px 13px;border:1px solid #dfe8f1;border-radius:11px;background:#fff;box-shadow:0 4px 10px rgba(30,72,107,.05);color:#61738a}.contact-page .contact-list li>span:nth-child(2){min-width:0;display:block;font-size:13px;line-height:1.45}.contact-page .contact-list strong{display:block;color:#203752;font-size:14px}.contact-page .contact-list a{display:block;overflow-wrap:anywhere;color:#71849a}.channel-icon{width:42px;height:42px;display:grid!important;place-items:center;flex:0 0 auto;border-radius:50%;color:#fff;font-size:18px;background:#148ae4}.channel-icon.line{background:#06c755}.channel-icon.facebook{background:#2476e8}.channel-icon.location{background:#1c91e9}.channel-icon.extra{background:#409fe5}.channel-arrow{position:absolute;right:14px;color:#8294a8;font-size:12px}.contact-sidebar-panel .map-card{margin-top:18px;border-radius:18px;overflow:hidden}.contact-sidebar-panel .map-card iframe{width:100%;min-height:240px}.contact-page .contact-channel-image-icon{width:42px;height:42px;border-radius:50%;padding:4px;background:#eaf6ff}
@media(max-width:900px){.contact-hero-art{width:270px;flex-basis:270px}.contact-layout{grid-template-columns:1fr}.contact-sidebar-panel{order:-1}.contact-page .contact-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.contact-hero-inner{min-height:205px}.contact-hero-copy{padding:28px 0}.contact-hero-copy p br{display:none}.contact-hero-art{display:none}.contact-content-section{padding-top:22px}.contact-form-card{padding:20px 16px;border-radius:14px}.contact-card-heading{align-items:flex-start}.contact-card-heading h2{font-size:20px}.contact-page .contact-list{grid-template-columns:1fr}.contact-channels-card{padding:17px;border-radius:14px}.contact-page .form-grid{gap:15px}.contact-privacy-note{line-height:1.5}}

/* ============================================================
   Article editor and readable article typography v3.5.0
============================================================ */
.article-editor-field .tox-tinymce {
    border-radius: 18px !important;
    border-color: #dbe4f0 !important;
    overflow: hidden !important;
    box-shadow: 0 14px 36px rgba(15, 23, 42, 0.08) !important;
}

.article-editor-field .tox .tox-toolbar,
.article-editor-field .tox .tox-toolbar__primary,
.article-editor-field .tox .tox-toolbar-overlord {
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
}

.article-content {
    font-size: 17px;
    line-height: 1.85;
    word-break: break-word;
}

.article-content > *:first-child {
    margin-top: 0 !important;
}

.article-content h2 {
    position: relative;
    margin: 34px 0 16px;
    padding-left: 16px;
    font-size: clamp(24px, 3vw, 34px);
    line-height: 1.3;
    color: #0f172a;
    letter-spacing: -0.03em;
}

.article-content h2::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0.18em;
    width: 5px;
    height: 1.25em;
    border-radius: 999px;
    background: linear-gradient(180deg, #2563eb, #38bdf8);
}

.article-content h3 {
    margin: 28px 0 12px;
    font-size: clamp(21px, 2.4vw, 27px);
    color: #1e3a8a;
    letter-spacing: -0.02em;
}

.article-content h4 {
    margin: 22px 0 10px;
    font-size: 20px;
    color: #0f172a;
}

.article-content p {
    margin: 0 0 18px;
    color: #334155;
}

.article-content ul,
.article-content ol {
    margin: 0 0 20px 0;
    padding-left: 26px;
    color: #334155;
}

.article-content li {
    margin: 8px 0;
    padding-left: 4px;
}

.article-content blockquote {
    margin: 24px 0;
    padding: 18px 22px;
    border-left: 5px solid #2563eb;
    border-radius: 0 18px 18px 0;
    background: linear-gradient(135deg, #eff6ff, #ffffff);
    color: #1e3a8a;
    font-weight: 600;
}

.article-content a {
    color: #2563eb;
    text-decoration: underline;
    text-underline-offset: 3px;
    font-weight: 700;
}

.article-content table {
    width: 100%;
    border-collapse: collapse;
    margin: 24px 0;
    overflow: hidden;
    border-radius: 16px;
    box-shadow: 0 0 0 1px #dbe4f0;
    display: table;
}

.article-content th,
.article-content td {
    border: 1px solid #dbe4f0;
    padding: 12px 14px;
    text-align: left;
    vertical-align: top;
}

.article-content th {
    background: #f1f5f9;
    color: #0f172a;
    font-weight: 800;
}

.article-content tr:nth-child(even) td {
    background: #f8fafc;
}

.article-content code {
    display: inline-block;
    padding: 2px 7px;
    border-radius: 8px;
    background: #f1f5f9;
    color: #0f172a;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 0.92em;
}

.article-content pre {
    overflow-x: auto;
    padding: 16px;
    border-radius: 16px;
    background: #0f172a;
    color: #e2e8f0;
}

@media (max-width: 640px) {
    .article-content {
        padding: 20px;
        font-size: 16px;
        line-height: 1.78;
    }

    .article-content table,
    .article-content thead,
    .article-content tbody,
    .article-content tr,
    .article-content th,
    .article-content td {
        display: block;
        width: 100%;
    }

    .article-content tr {
        border-bottom: 1px solid #dbe4f0;
    }

    .article-content th,
    .article-content td {
        border-left: 0;
        border-right: 0;
    }
}


/* Update 2026-07-19: compact navbar, province rows, landscape articles, security/UI */
.main-header-inner{gap:14px}.site-logo img{max-width:185px}.main-nav{gap:4px;flex-wrap:nowrap}.main-nav a{font-size:14px;padding:10px 9px;white-space:nowrap}.header-actions{gap:6px}.header-auth-button{padding:9px 11px}@media(max-width:1180px){.site-logo img{max-width:165px}.main-nav a{font-size:13px;padding:9px 7px}}@media(max-width:1040px){.nav-toggle{display:flex}.main-nav{position:absolute;top:100%;left:16px;right:16px;display:none;flex-direction:column;background:#fff;border:1px solid #e2e8f0;border-radius:18px;padding:10px;box-shadow:0 18px 45px rgba(15,23,42,.14);z-index:50}.main-nav.active{display:flex}.main-nav a{width:100%;padding:12px 14px}.header-actions{margin-left:auto}}
.province-tabs{display:none!important}.province-recommend-row{margin:26px 0 34px}.province-row-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid rgba(15,23,42,.08)}.province-row-heading h3{margin:0;font-size:22px;color:#0f172a}.province-row-heading i{color:#0877d1}.province-row-heading span{display:inline-flex;align-items:center;border-radius:999px;background:#e0f2fe;color:#075985;padding:6px 12px;font-size:13px;font-weight:700}.province-recommend-section .province-recommend-grid{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:16px!important}.province-recommend-section .recommend-property-card{min-width:0!important}.province-recommend-section .recommend-property-image{height:auto!important;aspect-ratio:16/10!important}@media(max-width:1280px){.province-recommend-section .province-recommend-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}}@media(max-width:1050px){.province-recommend-section .province-recommend-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}}@media(max-width:760px){.province-recommend-section .province-recommend-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.province-row-heading{align-items:flex-start;flex-direction:column}.province-row-heading h3{font-size:19px}}@media(max-width:480px){.province-recommend-section .province-recommend-grid{grid-template-columns:1fr!important}}
.home-article-showcase{display:grid;grid-template-columns:1.15fr .85fr;gap:18px}.home-article-card{display:grid;grid-template-columns:220px 1fr;gap:16px;align-items:stretch;background:#fff;border:1px solid #e2e8f0;border-radius:22px;overflow:hidden;box-shadow:0 12px 30px rgba(15,23,42,.08);transition:.2s}.home-article-card:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(15,23,42,.12)}.home-article-card:first-child{grid-row:span 3;display:block}.home-article-card:first-child .home-article-image{aspect-ratio:16/9;height:auto}.home-article-image{display:block;height:100%;min-height:140px;background:#e2e8f0}.home-article-image img{width:100%;height:100%;object-fit:cover;display:block}.home-article-body{padding:16px}.home-article-category{display:inline-flex;border-radius:999px;background:#eff6ff;color:#1d4ed8;font-size:12px;font-weight:800;padding:5px 10px;margin-bottom:10px}.home-article-body h3{font-size:18px;margin:0 0 8px;line-height:1.35}.home-article-card:first-child h3{font-size:24px}.home-article-body p{font-size:14px;color:#64748b;line-height:1.65;margin:0 0 12px}@media(max-width:920px){.home-article-showcase{grid-template-columns:1fr}.home-article-card,.home-article-card:first-child{display:block}.home-article-image{aspect-ratio:16/9;height:auto}}
.contact-list a{font-weight:700}.masked-phone-box{display:grid;gap:10px;padding:14px;border-radius:16px;background:#f8fafc;border:1px dashed #93c5fd;text-align:center}.masked-phone-box strong{font-size:20px;color:#0f172a}.masked-phone-box span{font-size:13px;color:#64748b}.captcha-box{background:#f8fafc;border:1px solid #e2e8f0;border-radius:16px;padding:14px}.auth-role-choice{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.auth-role-choice label{display:flex;align-items:center;gap:8px;padding:12px;border:1px solid #dbeafe;border-radius:14px;background:#fff}.social-login-separator{display:flex;align-items:center;gap:10px;margin:18px 0}.social-login-separator:before,.social-login-separator:after{content:"";height:1px;background:#e2e8f0;flex:1}.google-login-button{justify-content:center}.location-import-card{padding:24px}.admin-page-section{padding:24px}.admin-page-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:18px}.admin-page-header h1{margin:0 0 6px}


/* Google OAuth settings */
.google-oauth-guide-card{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:18px 0 22px;padding:18px;border:1px solid #dbeafe;background:linear-gradient(135deg,#f8fbff,#eef7ff);border-radius:20px}
.google-oauth-guide-card>div{background:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:14px;box-shadow:0 12px 28px rgba(15,23,42,.05)}
.google-oauth-guide-card strong{display:block;margin-bottom:10px;color:#0f172a}
.google-oauth-guide-card code{display:block;white-space:normal;word-break:break-all;margin-top:7px;padding:8px 10px;border-radius:10px;background:#f1f5f9;color:#075985;font-size:12px}
@media(max-width:980px){.google-oauth-guide-card{grid-template-columns:1fr}}

/* Publisher profile completion page */
.publisher-profile-wrap {
    min-height: calc(100vh - 88px);
    padding: 38px 0 48px;
    background:
        radial-gradient(circle at -4% 0%, rgba(255, 255, 255, 0.78) 0 10%, transparent 10.2%),
        radial-gradient(circle at 104% 96%, rgba(255, 255, 255, 0.58) 0 15%, transparent 15.2%),
        radial-gradient(circle at 100% 82%, rgba(214, 235, 255, 0.45) 0 18%, transparent 18.2%),
        linear-gradient(135deg, #edf7ff 0%, #f8fbff 52%, #eaf5ff 100%);
}
.publisher-profile-container {
    max-width: 1230px;
}
.publisher-profile-card {
    background: rgba(255, 255, 255, 0.97);
    border: 1px solid rgba(255, 255, 255, 0.96);
    border-radius: 28px;
    box-shadow: 0 18px 60px rgba(61, 116, 173, 0.09);
    padding: 36px 58px 38px;
    overflow: hidden;
    position: relative;
}
.publisher-profile-card::before {
    display: none;
}
.publisher-profile-hero {
    display: flex;
    gap: 30px;
    align-items: center;
    margin-bottom: 24px;
    padding-bottom: 25px;
    border-bottom: 1px solid #dce7f2;
}
.publisher-profile-icon {
    width: 94px;
    height: 94px;
    border-radius: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #1688e8;
    background: linear-gradient(145deg, #eaf6ff, #eef8ff);
    font-size: 39px;
    flex: 0 0 auto;
}
.publisher-profile-hero .section-eyebrow {
    margin: 0;
    color: #17253d;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0;
    text-transform: none;
}
.publisher-profile-hero h1 {
    margin: 8px 0 6px;
    font-size: clamp(32px, 3.3vw, 42px);
    line-height: 1.2;
    letter-spacing: -0.025em;
    color: #101f3b;
}
.publisher-profile-hero p:not(.section-eyebrow) {
    max-width: 930px;
    margin: 0;
    color: #718198;
    font-size: 15px;
    line-height: 1.7;
}
.publisher-profile-form .form-grid.two-columns {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 30px;
    row-gap: 23px;
}
.publisher-profile-form .form-group-wide {
    grid-column: 1 / -1;
}
.publisher-profile-form .form-group {
    margin: 0;
}
.publisher-profile-form label {
    display: block;
    margin-bottom: 8px;
    color: #172640;
    font-size: 16px;
    font-weight: 700;
}
.publisher-profile-form input {
    width: 100%;
    border: 1px solid #d5e1ee;
    border-radius: 14px;
    min-height: 52px;
    padding: 12px 18px;
    background: #fff;
    color: #233a59;
    font-size: 16px;
    box-shadow: inset 0 1px 2px rgba(15, 35, 65, 0.015);
    transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}
.publisher-profile-form input::placeholder {
    color: #8290a4;
    opacity: 1;
}
.publisher-profile-form input:focus {
    outline: none;
    border-color: #1689e8;
    box-shadow: 0 0 0 4px rgba(22, 137, 232, 0.12);
}
.publisher-profile-form small {
    color: #8592a6;
    display: block;
    margin-top: 7px;
    font-size: 13px;
    line-height: 1.55;
}
.publisher-profile-note {
    display: flex;
    gap: 12px;
    align-items: center;
    margin: 21px 0 20px;
    padding: 13px 18px;
    border-radius: 14px;
    color: #1384df;
    background: linear-gradient(90deg, #f0f9ff, #edf8ff);
    border: 1px solid #b9e1fb;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.55;
}
.publisher-profile-note i {
    color: #168eea;
    font-size: 25px;
    flex: 0 0 auto;
}
.publisher-profile-actions {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    flex-wrap: wrap;
}
.publisher-profile-actions .btn {
    min-height: 52px;
    padding: 12px 28px;
    border-radius: var(--radius-sm);
    font-size: 15px;
    font-weight: 700;
}
.publisher-profile-actions .btn-primary {
    min-width: 240px;
    box-shadow: 0 12px 24px rgba(15, 132, 229, 0.22);
}
.publisher-profile-actions .btn-ghost {
    min-width: 158px;
    color: #2b3b55;
    background: #fff;
    border-color: #d8e3ee;
}
.required {
    color: #e43d30;
}
@media (max-width: 1000px) {
    .publisher-profile-wrap {
        padding: 28px 0 38px;
    }
    .publisher-profile-card {
        padding: 32px 34px 34px;
    }
}
@media (max-width: 720px) {
    .publisher-profile-wrap {
        padding: 18px 0 28px;
    }
    .publisher-profile-card {
        padding: 24px 20px;
        border-radius: 22px;
    }
    .publisher-profile-hero {
        flex-direction: column;
        align-items: flex-start;
        gap: 18px;
        margin-bottom: 22px;
        padding-bottom: 22px;
    }
    .publisher-profile-icon {
        width: 72px;
        height: 72px;
        border-radius: 18px;
        font-size: 31px;
    }
    .publisher-profile-hero h1 {
        font-size: 30px;
    }
    .publisher-profile-form .form-grid.two-columns {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .publisher-profile-note {
        align-items: flex-start;
    }
    .publisher-profile-actions .btn {
        width: 100%;
        justify-content: center;
    }
}

/* Thai / English language switcher */
.language-switcher {
    position: relative;
    display: inline-block;
    color: #243044;
}

.language-switcher-button {
    appearance: none;
    -webkit-appearance: none;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 38px;
    padding: 5px 8px;
    border: 0;
    border-radius: 8px;
    color: #fff;
    background: transparent;
    box-shadow: none;
    font: inherit;
    font-size: 13px;
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
    outline: 0;
    transition: box-shadow .2s ease, transform .2s ease;
}

.language-switcher-button:hover,
.language-switcher-button:focus-visible {
    transform: none;
    background: rgba(255, 255, 255, .12);
    box-shadow: none;
    outline: none;
}

.language-chevron {
    margin-left: 3px;
    color: #fff;
    font-size: 11px;
    transition: transform .2s ease;
}

.language-switcher.open .language-chevron {
    transform: rotate(180deg);
}

.language-switcher-menu {
    position: absolute;
    z-index: 110;
    top: calc(100% + 7px);
    right: 0;
    width: 154px;
    padding: 8px;
    border: 1px solid #eef1f5;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(15, 23, 42, .18);
}

.language-switcher-menu[hidden] {
    display: none;
}

.language-switcher-option {
    display: grid;
    grid-template-columns: 18px 25px 1fr;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 6px 7px;
    border-radius: 8px;
    color: #384152 !important;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none !important;
}

.language-switcher-option:hover,
.language-switcher-option:focus-visible {
    color: #172033 !important;
    background: #f3f8fd;
    outline: none;
}

.language-check {
    visibility: hidden;
    color: #0877d1;
    font-size: 13px;
}

.language-switcher-option.active .language-check {
    visibility: visible;
}

.language-flag {
    font-size: 20px;
    line-height: 1;
}

.language-switcher-button .language-flag {
    width: 20px;
    height: 20px;
    display: inline-grid;
    place-items: center;
    flex: 0 0 20px;
    overflow: hidden;
    border: 1.5px solid rgba(255, 255, 255, .92);
    border-radius: 50%;
    background: #fff;
    font-size: 17px;
    box-shadow: 0 1px 3px rgba(3, 44, 89, .2);
}

.language-switcher-button .language-flag-th {
    background: linear-gradient(to bottom,
        #cf152d 0 20%,
        #fff 20% 35%,
        #273b87 35% 65%,
        #fff 65% 80%,
        #cf152d 80% 100%);
    font-size: 0;
}

@media (max-width: 768px) {
    .top-strip-right {
        gap: 8px;
    }

    .language-switcher-button {
        min-height: 36px;
        padding: 4px 6px;
        font-size: 12px;
    }

    .top-strip-email {
        display: none !important;
    }
}


/* Reports / Issue reports / Article tags update */
.admin-filter-bar{display:flex;gap:12px;align-items:end;flex-wrap:wrap;background:#fff;border:1px solid #e2e8f0;border-radius:18px;padding:16px;margin:18px 0;box-shadow:0 12px 30px rgba(15,23,42,.06)}
.admin-filter-bar input,.admin-filter-bar select{min-height:44px;border:1px solid #dbe4f0;border-radius:12px;padding:0 14px;background:#fff;min-width:180px}.admin-filter-bar input{flex:1;min-width:240px}.admin-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:18px 0}.admin-kpi-card{display:block;background:linear-gradient(135deg,#fff,#f8fbff);border:1px solid #dbeafe;border-radius:20px;padding:18px;text-decoration:none;color:#0f172a;box-shadow:0 14px 34px rgba(37,99,235,.08)}.admin-kpi-card span{display:block;color:#64748b;font-weight:700;font-size:13px}.admin-kpi-card strong{display:block;margin-top:8px;font-size:30px;color:#0f4b8f}.admin-report-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:18px 0}.admin-panel{background:#fff;border:1px solid #e2e8f0;border-radius:22px;padding:20px;box-shadow:0 14px 34px rgba(15,23,42,.06)}.admin-panel h2{margin:0 0 14px;font-size:20px}.report-list{display:grid;gap:10px}.report-list-row{display:grid;grid-template-columns:1fr auto;gap:6px 12px;align-items:center;padding:12px;border-radius:14px;background:#f8fafc;border:1px solid #edf2f7}.report-list-row span{font-weight:800}.report-list-row strong{color:#2563eb}.report-list-row small{grid-column:1/-1;color:#64748b}.issue-report-card,.property-issue-card{border-color:#fed7aa;background:linear-gradient(180deg,#fff,#fff7ed)}.issue-report-modal[hidden]{display:none}.issue-report-modal{position:fixed;inset:0;z-index:2000;display:grid;place-items:center;padding:18px}.issue-report-backdrop{position:absolute;inset:0;background:rgba(15,23,42,.62);backdrop-filter:blur(5px)}.issue-report-dialog{position:relative;width:min(640px,100%);max-height:90vh;overflow:auto;background:#fff;border-radius:24px;padding:24px;box-shadow:0 30px 90px rgba(15,23,42,.35)}.issue-report-close{position:absolute;right:16px;top:16px;border:0;background:#f1f5f9;width:38px;height:38px;border-radius:50%;cursor:pointer}.issue-report-head{display:flex;gap:14px;align-items:center;margin-bottom:18px}.issue-report-icon{width:54px;height:54px;border-radius:18px;display:grid;place-items:center;background:#fff7ed;color:#ea580c;font-size:24px}.issue-report-head h2{margin:0;font-size:24px}.issue-report-head p{margin:4px 0 0;color:#64748b}.issue-admin-list{display:grid;gap:16px;margin-top:18px}.issue-admin-card{background:#fff;border:1px solid #e2e8f0;border-radius:22px;padding:20px;box-shadow:0 14px 34px rgba(15,23,42,.06)}.issue-admin-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.issue-admin-head h2{margin:8px 0 6px;font-size:20px}.issue-admin-head p{margin:0;color:#64748b}.issue-admin-head time{white-space:nowrap;color:#64748b;font-size:13px}.status-badge{display:inline-flex;align-items:center;padding:5px 10px;border-radius:999px;font-size:12px;font-weight:800;background:#e2e8f0;color:#334155}.status-new{background:#fee2e2;color:#b91c1c}.status-reviewing{background:#fef3c7;color:#92400e}.status-resolved{background:#dcfce7;color:#166534}.issue-message{padding:14px;border-radius:16px;background:#f8fafc;border:1px solid #edf2f7;line-height:1.8}.issue-meta{display:flex;gap:10px;flex-wrap:wrap;color:#475569;font-size:13px}.issue-meta span{background:#f1f5f9;border-radius:999px;padding:7px 10px}.issue-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.article-tag-cloud{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:30px;padding:18px;border-radius:18px;background:#f8fafc;border:1px solid #e2e8f0}.article-tag-cloud a,.article-sidebar-tags a{display:inline-flex;padding:7px 11px;border-radius:999px;background:#eff6ff;color:#1d4ed8;text-decoration:none;font-weight:800;font-size:13px}.article-sidebar-tags{display:flex;gap:8px;flex-wrap:wrap}.internal-link-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.internal-link-card{display:grid;grid-template-columns:auto 1fr;gap:6px 12px;align-items:center;padding:14px;border:1px solid #dbeafe;border-radius:18px;background:#fff;text-decoration:none;color:#0f172a}.internal-link-card span{grid-row:1/3;width:38px;height:38px;border-radius:14px;display:grid;place-items:center;background:#eff6ff;color:#2563eb}.internal-link-card strong{line-height:1.35}.internal-link-card small{color:#64748b}.article-current-tag{display:inline-flex;gap:8px;align-items:center;margin:12px 0 0;padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.22);border:1px solid rgba(255,255,255,.35);font-weight:800}
@media(max-width:900px){.admin-kpi-grid,.admin-report-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.internal-link-grid{grid-template-columns:1fr}.issue-admin-head{display:block}.issue-admin-head time{display:block;margin-top:8px}.admin-filter-bar input{min-width:100%}}
@media(max-width:560px){.admin-kpi-grid{grid-template-columns:1fr}.admin-panel,.issue-admin-card,.issue-report-dialog{padding:16px;border-radius:18px}.issue-meta span{width:100%}}

/* Search report: latest searches */
.latest-search-panel{padding:22px;overflow:hidden}
.latest-search-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:18px}
.latest-search-heading h2{margin:0 0 4px;color:#10233f;font-size:26px;line-height:1.3}
.latest-search-heading p{margin:0;color:#7b8b9d;font-size:15px}
.report-filter-submit,.latest-search-export{border-radius:10px}
.latest-search-export{min-height:44px;padding:10px 17px;font-size:14px;text-decoration:none;white-space:nowrap}
.latest-search-export:hover{color:#fff}
.latest-search-table-wrap{border:1px solid #e1e9f2;border-radius:14px}
.latest-search-table{width:100%;min-width:1240px;border-collapse:separate;border-spacing:0;color:#21364f;font-size:14px}
.latest-search-table th,.latest-search-table td{padding:13px 14px;border-bottom:1px solid #e7edf4;text-align:left;vertical-align:middle;white-space:nowrap}
.latest-search-table th{background:#f4f7fa;color:#61758a;font-size:14px;font-weight:800}
.latest-search-table th:first-child{border-top-left-radius:13px}
.latest-search-table th:last-child{border-top-right-radius:13px}
.latest-search-table tbody tr{transition:background .15s ease}
.latest-search-table tbody tr:hover{background:#f9fcff}
.latest-search-table tbody tr:last-child td{border-bottom:0}
.latest-search-table .cell-center{text-align:center}
.search-time{display:flex;align-items:center;gap:8px;color:#32475f}
.search-time i{color:#52677e;font-size:13px}
.search-keyword{color:#21364f;font-weight:800}
.muted-value{color:#7e8fa2}
.search-type-badge{display:inline-flex;align-items:center;max-width:190px;overflow:hidden;text-overflow:ellipsis;padding:7px 11px;border:1px solid #dbeafe;border-radius:999px;background:#eff6ff;color:#2563eb;font-size:14px;font-weight:800}
.search-result-badge{display:inline-grid;place-items:center;min-width:28px;height:28px;padding:0 8px;border-radius:999px;font-size:12px;font-weight:900}
.search-result-badge.no-results{background:#e9eef3;color:#64748b}
.search-result-badge.has-results{background:#119bea;color:#fff;box-shadow:0 4px 10px rgba(17,155,234,.2)}
.search-ip{display:block;max-width:178px;overflow:hidden;text-overflow:ellipsis;color:#2b4058;font-variant-numeric:tabular-nums}
.latest-search-actions{display:flex;justify-content:center;gap:7px}
.search-icon-button{width:34px;height:34px;display:inline-grid;place-items:center;border:1px solid #d9e6f2;border-radius:50%;background:#fff;color:#168ee2;font-size:13px;cursor:pointer;transition:.18s ease}
.search-icon-button:hover{border-color:#8fc6ed;background:#eef8ff;transform:translateY(-1px)}
.search-icon-button.is-copied{border-color:#68d391;background:#ecfdf3;color:#169657}
.search-icon-button:disabled{cursor:not-allowed;opacity:.45;transform:none}
.latest-search-footer{display:grid;grid-template-columns:1fr auto 1fr;gap:16px;align-items:center;padding-top:16px}
.latest-search-footer>p{margin:0;color:#64748b;font-size:14px}
.latest-search-footer .pagination{margin:0;gap:6px}
.latest-search-footer .page-link,.latest-search-footer .page-dots{min-width:38px;height:38px;padding:0 12px;border-radius:9px;font-size:14px}
.latest-search-per-page{justify-self:end}
.latest-search-per-page select{min-height:40px;padding:0 36px 0 13px;border:1px solid #dbe4ef;border-radius:9px;background:#fff;color:#40556d;font:inherit;font-size:14px;cursor:pointer}
.latest-search-empty{padding:54px 20px;text-align:center;color:#7b8b9d}
.latest-search-empty>i{width:54px;height:54px;display:grid;place-items:center;margin:0 auto 14px;border-radius:18px;background:#edf7ff;color:#168ee2;font-size:21px}
.latest-search-empty h3{margin:0 0 5px;color:#243b55}
.latest-search-empty p{margin:0}
.latest-search-panel.is-loading{opacity:.58;pointer-events:none;transition:opacity .18s ease}
.copy-toast{position:fixed;right:24px;bottom:24px;z-index:3000;padding:11px 16px;border-radius:11px;background:#17324d;color:#fff;font-size:13px;font-weight:800;box-shadow:0 14px 35px rgba(15,23,42,.22)}
.copy-toast[hidden]{display:none}
@media(max-width:900px){.latest-search-footer{grid-template-columns:1fr auto}.latest-search-footer .pagination{grid-column:1/-1;grid-row:1;order:-1}.latest-search-per-page{grid-column:2}.latest-search-footer>p{grid-column:1}}
@media(max-width:560px){.latest-search-panel{padding:15px}.latest-search-heading{align-items:stretch;flex-direction:column}.latest-search-export{justify-content:center}.latest-search-footer{display:flex;align-items:stretch;flex-direction:column}.latest-search-footer .pagination{order:0}.latest-search-per-page{width:100%}.latest-search-per-page select{width:100%}.copy-toast{right:12px;bottom:12px;left:12px;text-align:center}}


/* User verified / Google avatar update */
.admin-user-cell{display:flex;align-items:center;gap:12px;min-width:220px}.admin-user-avatar{width:44px;height:44px;border-radius:999px;background:linear-gradient(135deg,#e8f3ff,#f8fbff);border:2px solid #d8e8f8;display:grid;place-items:center;overflow:hidden;font-weight:900;color:#0877d1;flex:0 0 auto}.admin-user-avatar img{width:100%;height:100%;object-fit:cover;display:block}.admin-user-avatar.is-verified{border-color:#22c55e;box-shadow:0 0 0 4px rgba(34,197,94,.14)}.admin-check-card{display:flex;align-items:flex-start;gap:12px;padding:14px;border:1px solid #dbeafe;border-radius:16px;background:#f8fcff;cursor:pointer;height:100%}.admin-check-card input{margin-top:4px;accent-color:#16a34a}.admin-check-card strong{display:block;color:#14324f}.admin-check-card small{display:block;color:#64748b;line-height:1.5;margin-top:3px}.owner-profile-head{display:flex;flex-direction:column;align-items:center;gap:10px;margin-bottom:10px}.owner-avatar img{width:100%;height:100%;object-fit:cover;display:block}.owner-avatar-verified{border:4px solid #22c55e;box-shadow:0 10px 30px rgba(34,197,94,.22),0 0 0 6px rgba(34,197,94,.12)}.owner-verified-pill,.verified-owner-badge{display:inline-flex;align-items:center;gap:6px;border-radius:999px;background:#eafbf2;color:#15803d;border:1px solid #bbf7d0;font-weight:900;font-size:12px;padding:6px 10px}.property-card-verified{border-color:rgba(34,197,94,.45)!important;box-shadow:0 14px 32px rgba(21,128,61,.10),0 8px 24px rgba(15,71,120,.06)!important}.property-card-verified-badge{position:absolute;left:10px;bottom:10px;display:inline-flex;align-items:center;gap:5px;background:rgba(236,253,245,.96);border:1px solid #86efac;color:#15803d;border-radius:999px;padding:6px 9px;font-size:11px;font-weight:900;box-shadow:0 8px 20px rgba(21,128,61,.18);z-index:4}.property-card-image{position:relative}.badge-success i,.badge-info i{margin-right:4px}

/* Admin properties redesign */
.properties-admin-page .admin-content{background:#f6f9fc}
.properties-admin-page .admin-topbar .property-add-button{gap:8px;border-radius:8px!important}
.property-filter-card{padding:18px;border-radius:14px!important}
.property-filter-grid{display:grid;grid-template-columns:minmax(260px,2.4fr) repeat(4,minmax(125px,1fr)) auto;gap:14px;align-items:end}
.property-filter-grid .form-group{min-width:0}
.property-filter-grid label{font-size:13px}
.property-filter-grid input,.property-filter-grid select{height:44px;border-radius:9px;font-size:13px}
.property-filter-grid select{
    appearance:none;
    -webkit-appearance:none;
    padding-right:42px;
    background-color:#fff;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%23334e68' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat:no-repeat;
    background-position:right 15px center;
    background-size:12px 8px;
}
.property-search-input{position:relative}
.property-search-input>i{position:absolute;left:14px;top:50%;z-index:1;transform:translateY(-50%);color:#7890aa;font-size:13px}
.property-search-input input{padding-left:38px}
.property-filter-actions{display:flex;gap:10px}
.property-filter-actions .btn{height:44px;min-height:44px;padding:0 17px;border-radius:9px;white-space:nowrap}
.property-filter-actions .btn i{margin-right:6px}
.property-table-card{border-radius:14px}
.property-table{width:100%;min-width:0;table-layout:fixed}
.property-table th{padding:13px 8px;background:#fbfdff;color:#59708b;font-size:14px}
.property-table td{padding:13px 8px;font-size:15px;overflow-wrap:anywhere}
.property-table th:nth-child(1){width:20%}
.property-table th:nth-child(2){width:12%}
.property-table th:nth-child(3){width:17%}
.property-table th:nth-child(4){width:12%}
.property-table th:nth-child(5){width:9%}
.property-table th:nth-child(6){width:10%}
.property-table th:nth-child(7){width:7%}
.property-table th:nth-child(8){width:13%}
.property-table tbody tr{transition:background .18s ease}
.property-table tbody tr:hover{background:#fbfdff}
.property-table td>strong,.property-table td>small{display:block}
.property-table td>small,.property-location small,.property-listing-cell span{margin-top:4px;color:#71859b;font-size:13px;line-height:1.45}
.property-table .badge{white-space:nowrap}
.property-listing-cell{display:flex;align-items:center;gap:10px;min-width:0}
.property-listing-cell>div{min-width:0}
.property-listing-cell img{width:58px;height:48px;flex:0 0 auto;object-fit:cover;border-radius:8px;background:#f1f5f9}
.property-listing-cell strong{display:block;color:#142d49;font-size:15px}
.property-listing-cell span{display:block}
.property-location{min-width:0}
.property-location span{display:block}
.property-location i{margin-right:6px;color:#567798}
.property-location small{display:block;max-width:260px}
.property-price{display:block;min-width:0;font-size:15px}
.property-admin-note{max-width:160px}
.property-views{display:inline-flex;align-items:center;gap:6px;color:#526c88}
.property-icon-actions{display:flex;align-items:center;gap:7px;white-space:nowrap}
.property-icon-actions form{display:inline-flex;margin:0}
.property-icon-button{width:34px;height:34px;display:inline-grid;place-items:center;padding:0;border:1px solid #dce6f1;border-radius:9px;background:#fff;color:#5e7893;cursor:pointer;text-decoration:none;transition:transform .15s ease,box-shadow .15s ease,background .15s ease}
.property-icon-button:hover{transform:translateY(-1px);box-shadow:0 5px 14px rgba(31,71,111,.12)}
.property-icon-button.is-edit{border-color:#cbe4ff;color:#0877d1;background:#f4faff}
.property-icon-button.is-approve{border-color:#bdebd0;color:#16804a;background:#f2fff7}
.property-icon-button.is-reject,.property-icon-button.is-delete{border-color:#ffd7d7;color:#dc2626;background:#fffafa}
.property-empty-row td{text-align:center!important;padding:48px!important;color:#71859b}
.property-empty-row i{display:block;margin-bottom:10px;font-size:28px;color:#a7b7c8}
.property-table-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 16px;border-top:1px solid #e5edf5;background:#fff}
.property-table-footer>p{margin:0;color:#64788f;font-size:13px}
.property-table-footer .pagination{justify-content:flex-end;margin:0;gap:6px}

.property-table-footer .page-link,.property-table-footer .page-dots{min-width:34px;height:34px;padding:0 10px;border-radius:8px;font-size:12px}
.property-results{position:relative;min-height:160px}
.property-results.is-loading::after{content:"";position:absolute;inset:0;z-index:5;border-radius:14px;background:rgba(255,255,255,.72)}
.property-results.is-loading::before{content:"";position:absolute;z-index:6;left:50%;top:70px;width:28px;height:28px;margin-left:-14px;border:3px solid #d8eaff;border-top-color:#0877d1;border-radius:50%;animation:property-spin .7s linear infinite}
@keyframes property-spin{to{transform:rotate(360deg)}}
@media(max-width:1350px){.property-filter-grid{grid-template-columns:repeat(4,minmax(140px,1fr))}.property-filter-keyword{grid-column:span 2}.property-filter-actions{grid-column:span 2;justify-content:flex-end}}
@media(min-width:901px) and (max-width:1200px){.property-table{min-width:1080px}}
@media(max-width:900px){.property-filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.property-filter-keyword{grid-column:1/-1}.property-filter-actions{grid-column:1/-1;justify-content:stretch}.property-filter-actions .btn{flex:1}.property-table{min-width:0}.property-table thead{display:none}.property-table,.property-table tbody,.property-table tr,.property-table td{display:block;width:100%}.property-table tbody{display:grid;gap:14px;padding:0;background:transparent}.property-table tr{padding:16px;border:1px solid #dfe8f1;border-radius:13px;background:#fff;box-shadow:0 7px 20px rgba(31,68,103,.06)}.property-table td{display:grid;grid-template-columns:105px minmax(0,1fr);gap:12px;padding:9px 0;border:0}.property-table td::before{content:attr(data-label);color:#71859b;font-size:12px;font-weight:800}.property-table td:first-child{display:block;padding-top:0;padding-bottom:13px;border-bottom:1px solid #edf2f7}.property-table td:first-child::before{display:none}.property-listing-cell{min-width:0}.property-listing-cell img{width:72px;height:58px}.property-location{min-width:0}.property-location small{max-width:none}.property-icon-actions{flex-wrap:wrap}.property-table-card{overflow:visible;border:0;background:transparent;box-shadow:none}.property-table-card .table-responsive{overflow:visible}.property-table-footer{margin-top:14px;border:1px solid #dfe8f1;border-radius:13px;flex-direction:column;align-items:stretch}.property-table-footer>p{text-align:center}.property-table-footer .pagination{justify-content:center}}
@media(max-width:560px){.property-filter-grid{grid-template-columns:1fr}.property-filter-keyword,.property-filter-actions{grid-column:1}.property-filter-actions{flex-direction:column}.property-table td{grid-template-columns:84px minmax(0,1fr)}.property-table-footer .pagination{gap:4px}.property-table-footer .page-link,.property-table-footer .page-dots{min-width:31px;height:31px;padding:0 8px}.property-icon-button{width:38px;height:38px}}

/* Admin users: compact management layout aligned with the properties screens */
.users-admin-page .admin-content{background:#f6f9fc}
.users-admin-page .admin-topbar{margin-bottom:18px}
.users-admin-page .admin-topbar .user-add-button{gap:8px;border-radius:8px!important}
.user-stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:18px}
.user-stat-card{display:flex;align-items:center;gap:14px;min-width:0;padding:17px 18px;border:1px solid #dfe8f1;border-radius:14px;background:#fff;box-shadow:0 5px 18px rgba(31,68,103,.05)}
.user-stat-icon{display:grid;place-items:center;width:44px;height:44px;flex:0 0 44px;border-radius:12px;background:#eef6ff;color:#1677d2;font-size:18px}
.user-stat-card.is-active .user-stat-icon{background:#ecfdf3;color:#16a34a}
.user-stat-card.is-owner .user-stat-icon{background:#f3f0ff;color:#7c3aed}
.user-stat-card.is-verified .user-stat-icon{background:#fff7e6;color:#d97706}
.user-stat-card small,.user-stat-card strong{display:block}
.user-stat-card small{color:#71859b;font-size:12px;font-weight:700}
.user-stat-card strong{margin-top:2px;color:#14324f;font-size:23px;line-height:1.2}
.user-editor-card{display:none;padding:24px;border-radius:14px!important}
.user-editor-card.is-open{display:block;animation:userEditorReveal .22s ease-out}
@keyframes userEditorReveal{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
.user-editor-card .section-header{align-items:flex-start;margin-bottom:20px}
.user-editor-card .section-title{margin-top:3px;font-size:24px!important}
.user-section-eyebrow{color:#2581d8;font-size:12px;font-weight:800;letter-spacing:.03em}
.user-editor-close{display:grid;place-items:center;width:36px;height:36px;padding:0;border:0;border-radius:9px;background:#f1f5f9;color:#64748b;cursor:pointer}
.user-editor-close:hover{background:#e7edf4;color:#1e3a56}
.user-editor-card .form-group.col-12 .btn{min-width:190px;gap:8px}
.user-filter-card{padding:18px;border-radius:14px!important}
.user-filter-grid{display:grid;grid-template-columns:minmax(280px,2fr) minmax(160px,.7fr) minmax(160px,.7fr) auto;gap:14px;align-items:end}
.user-filter-grid .form-group{min-width:0}
.user-filter-grid label{font-size:13px}
.user-filter-grid input,.user-filter-grid select{height:44px;border-radius:9px;font-size:13px}
.user-search-input{position:relative}
.user-search-input>i{position:absolute;top:50%;left:15px;z-index:1;color:#7c91a8;transform:translateY(-50%);pointer-events:none}
.user-search-input input{padding-left:42px}
.user-filter-actions{display:flex;gap:9px}
.user-filter-actions .btn{height:44px;min-height:44px;padding:0 16px;border-radius:9px;white-space:nowrap}
.user-filter-actions .btn i{margin-right:6px}
.user-table-card{overflow:hidden;border-radius:14px}
.user-table{width:100%;min-width:0;table-layout:fixed}
.user-table th{padding:13px 12px;background:#fbfdff;color:#59708b;font-size:13px}
.user-table td{padding:14px 12px;font-size:14px;vertical-align:middle;overflow-wrap:anywhere}
.user-table th:nth-child(1){width:25%}
.user-table th:nth-child(2){width:12%}
.user-table th:nth-child(3){width:17%}
.user-table th:nth-child(4){width:10%}
.user-table th:nth-child(5){width:15%}
.user-table th:nth-child(6){width:7%}
.user-table th:nth-child(7){width:14%}
.user-table tbody tr{transition:background .18s ease}
.user-table tbody tr:hover{background:#fbfdff}
.user-table .admin-user-cell{min-width:0}
.user-table .admin-user-cell>div:last-child{min-width:0}
.user-table .admin-user-cell strong,.user-table .admin-user-cell small{display:block;overflow:hidden;text-overflow:ellipsis}
.user-verified-label{display:inline-flex;align-items:center;gap:4px;margin-top:5px;color:#15803d;font-size:11px;font-weight:800}
.user-role-pill{display:inline-flex;padding:6px 9px;border-radius:999px;background:#eff6ff;color:#1d6dad;font-size:12px;font-weight:800;white-space:nowrap}
.user-role-pill.is-admin{background:#f3e8ff;color:#7e22ce}
.user-role-pill.is-user{background:#f1f5f9;color:#52667b}
.user-joined-date{display:block;margin-top:4px;color:#8a9bad;font-size:11px}
.user-property-count{display:inline-grid;place-items:center;min-width:32px;height:32px;padding:0 8px;border-radius:9px;background:#edf6ff;color:#1677d2}
.user-icon-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.user-icon-actions form{display:flex!important;margin:0}
.user-icon-button{display:grid;place-items:center;width:34px;height:34px;padding:0;border:1px solid #dbe7f2;border-radius:9px;background:#fff;color:#54718d;cursor:pointer;transition:transform .16s ease,background .16s ease,border-color .16s ease}
.user-icon-button:hover{transform:translateY(-1px)}
.user-icon-button.is-edit{background:#edf7ff;border-color:#cce8ff;color:#1677d2}
.user-icon-button.is-verify{background:#f7f9fc;color:#8393a4}
.user-icon-button.is-verify.is-active{background:#ecfdf3;border-color:#bbf7d0;color:#16a34a}
.user-icon-button.is-status{background:#fff8e8;border-color:#fde7ad;color:#d88a05}
.user-icon-button.is-delete{background:#fff1f2;border-color:#fecdd3;color:#e11d48}
.user-empty-state{text-align:center!important;padding:46px 24px!important;color:#71859b}
.user-empty-state i,.user-empty-state span{display:block}
.user-empty-state i{margin-bottom:9px;font-size:28px;color:#a9bac9}
.user-table-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 16px;border-top:1px solid #e5edf5;background:#fff}
.user-table-footer>p{margin:0;color:#64788f;font-size:13px}
.user-table-footer .pagination{justify-content:flex-end;margin:0;gap:6px}
.user-table-footer .page-link,.user-table-footer .page-dots{min-width:34px;height:34px;padding:0 10px;border-radius:8px;font-size:12px}
@media(max-width:1200px){.user-filter-grid{grid-template-columns:2fr 1fr 1fr}.user-filter-actions{grid-column:1/-1;justify-content:flex-end}.user-table{min-width:1050px}}
@media(max-width:900px){.user-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.user-filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.user-filter-keyword,.user-filter-actions{grid-column:1/-1}.user-filter-actions{justify-content:stretch}.user-filter-actions .btn{flex:1}.user-table{min-width:0}.user-table thead{display:none}.user-table,.user-table tbody,.user-table tr,.user-table td{display:block;width:100%}.user-table tbody{display:grid;gap:14px;background:transparent}.user-table tr{padding:16px;border:1px solid #dfe8f1;border-radius:13px;background:#fff;box-shadow:0 7px 20px rgba(31,68,103,.06)}.user-table td{display:grid;grid-template-columns:105px minmax(0,1fr);gap:12px;padding:9px 0;border:0}.user-table td::before{content:attr(data-label);color:#71859b;font-size:12px;font-weight:800}.user-table td:first-child{display:block;padding-top:0;padding-bottom:14px;border-bottom:1px solid #edf2f7}.user-table td:first-child::before{display:none}.user-table-card{overflow:visible;border:0;background:transparent;box-shadow:none}.user-table-card .table-responsive{overflow:visible}.user-table-footer{margin-top:14px;border:1px solid #dfe8f1;border-radius:13px;flex-direction:column;align-items:stretch}.user-table-footer>p{text-align:center}.user-table-footer .pagination{justify-content:center}}
@media(max-width:560px){.users-admin-page .admin-topbar{align-items:stretch;flex-direction:column}.users-admin-page .user-add-button{width:100%}.user-stat-grid{grid-template-columns:1fr 1fr;gap:10px}.user-stat-card{padding:13px;gap:10px}.user-stat-icon{width:38px;height:38px;flex-basis:38px}.user-stat-card strong{font-size:20px}.user-editor-card{padding:20px 16px}.user-filter-grid{grid-template-columns:1fr}.user-filter-keyword,.user-filter-actions{grid-column:1}.user-filter-actions{flex-direction:column}.user-table td{grid-template-columns:88px minmax(0,1fr)}.user-table-footer .pagination{gap:4px}.user-icon-button{width:38px;height:38px}}

.user-avatar img{width:100%;height:100%;object-fit:cover;display:block;border-radius:999px}.user-avatar.is-verified{outline:2px solid #22c55e;box-shadow:0 0 0 4px rgba(34,197,94,.14)}

/* Property owner contact card: reference layout with Login-style button radius. */
.property-detail-page .owner-box {
    position: relative;
    padding: 22px 24px 24px;
    text-align: center;
    background: var(--white);
}

.property-detail-page .owner-profile-head {
    align-items: stretch;
    gap: 16px;
    margin-bottom: 10px;
}

.property-detail-page .owner-avatar-wrap {
    position: relative;
    width: 90px;
    height: 90px;
    margin-inline: auto;
}

.property-detail-page .owner-avatar {
    width: 90px;
    height: 90px;
    margin: 0;
    border: 1px solid #a7e7bf;
    background: linear-gradient(145deg, #f1f5f9, #e8edf3);
    color: #8793a5;
    font-size: 36px;
    box-shadow: 0 7px 18px rgba(15, 23, 42, .08);
}

.property-detail-page .owner-avatar-check {
    position: absolute;
    right: -3px;
    bottom: 2px;
    width: 23px;
    height: 23px;
    display: grid;
    place-items: center;
    border: 2px solid var(--white);
    border-radius: 50%;
    background: #16b85b;
    color: var(--white);
    font-size: 11px;
    box-shadow: 0 3px 8px rgba(22, 184, 91, .25);
}

.property-detail-page .owner-verified-pill {
    align-self: flex-start;
    padding: 7px 11px;
    border-radius: 10px;
    border: 0;
    background: #e6f8ed;
    color: #178447;
    font-size: 12px;
    line-height: 1.35;
}

.property-detail-page .owner-box h3 {
    margin: 0 0 1px;
    color: var(--text);
    font-size: 22px;
    line-height: 1.35;
}

.property-detail-page .owner-role {
    display: block;
    color: var(--text-muted);
    font-size: 14px;
    font-weight: 700;
}

.property-detail-page .owner-box > .owner-contact-note {
    margin: 5px 0 20px;
    color: var(--text-muted);
    font-size: 14px;
}

.property-detail-page .contact-actions {
    gap: 10px;
}

.property-detail-page .owner-contact-action {
    position: relative;
    min-height: 48px;
    justify-content: flex-start;
    gap: 12px;
    padding: 11px 16px;
    border-radius: 10px;
    font-weight: 800;
    text-align: left;
    box-shadow: none;
}

.property-detail-page .owner-contact-action i {
    width: 21px;
    flex: 0 0 21px;
    font-size: 18px;
    text-align: center;
}

.property-detail-page .owner-contact-action span {
    min-width: 0;
    overflow-wrap: anywhere;
}

.property-detail-page .owner-contact-action.btn-primary,
.property-detail-page .owner-contact-action.btn-secondary,
.property-detail-page .owner-contact-action.btn-ghost {
    border-color: #cbd8e6;
    background: var(--white);
    color: var(--text-soft);
    box-shadow: none;
}

.property-detail-page .owner-contact-action i {
    color: #087fe3;
}

.property-detail-page .owner-contact-phone.btn-primary {
    border-color: #69b5f5;
    color: #0877d1;
}

.property-detail-page .owner-contact-line.btn-secondary {
    border-color: #8cd8aa;
    color: #13854b;
}

.property-detail-page .owner-contact-line i {
    color: #16a34a;
}

.property-detail-page .owner-contact-login.btn-primary {
    border-color: #69b5f5;
    color: #0877d1;
}

.property-detail-page .owner-contact-action:hover {
    border-color: #64b5f6;
    background: #f5faff;
    color: #0877d1;
    box-shadow: 0 7px 16px rgba(8, 119, 209, .09);
}

.property-detail-page .owner-contact-action:focus-visible {
    outline: 3px solid rgba(14, 165, 233, .22);
    outline-offset: 2px;
}

.property-detail-page .masked-phone-box {
    padding: 16px;
    border-radius: 10px;
}

/* Guest-only owner card. Member contact actions above remain unchanged. */
.property-detail-page .owner-box-guest .owner-avatar-wrap,
.property-detail-page .owner-box-guest .owner-avatar {
    width: 98px;
    height: 98px;
}

.property-detail-page .owner-box-guest .owner-avatar {
    font-size: 40px;
}

.property-detail-page .owner-box-guest h3 {
    font-size: 24px;
}

.property-detail-page .owner-box-guest .owner-role {
    font-size: 15px;
}

.property-detail-page .owner-box-guest > .owner-contact-note {
    margin-top: 7px;
    font-size: 15px;
}

.property-detail-page .owner-box-guest .masked-phone-box {
    display: grid;
    gap: 16px;
    padding: 17px;
    border: 2px dashed #78b9f8;
    border-radius: 10px;
    background: linear-gradient(135deg, #fbfdff, #f3f8ff);
    text-align: left;
}

.property-detail-page .masked-phone-summary {
    display: flex;
    align-items: center;
    gap: 13px;
}

.property-detail-page .masked-phone-icon {
    width: 50px;
    height: 50px;
    display: grid;
    place-items: center;
    flex: 0 0 50px;
    border-radius: 50%;
    background: #e4f1ff;
    color: #087fe3;
    font-size: 22px;
}

.property-detail-page .masked-phone-copy {
    min-width: 0;
}

.property-detail-page .masked-phone-copy strong,
.property-detail-page .masked-phone-copy span {
    display: block;
}

.property-detail-page .masked-phone-copy strong {
    color: #172033;
    font-size: 20px;
    line-height: 1.4;
    overflow-wrap: anywhere;
}

.property-detail-page .masked-phone-copy span {
    margin-top: 3px;
    color: #68778b;
    font-size: 13px;
    line-height: 1.55;
}

.property-detail-page .owner-box-guest .owner-contact-login.btn-primary {
    min-height: 50px;
    justify-content: center;
    border-color: transparent;
    background: linear-gradient(135deg, #0b8fec, #2563eb);
    color: var(--white);
    box-shadow: 0 10px 22px rgba(37, 99, 235, .2);
    text-align: center;
}

.property-detail-page .owner-box-guest .owner-contact-login i {
    color: var(--white);
}

.property-detail-page .owner-box-guest .owner-contact-login span {
    color: var(--white);
}

.property-detail-page .owner-box-guest .owner-contact-login:hover {
    border-color: transparent;
    background: linear-gradient(135deg, #087fd8, #1d4ed8);
    color: var(--white);
}

.property-detail-page .owner-box-guest .owner-contact-guest-link {
    min-height: 52px;
    font-size: 15px;
}

.property-detail-page .owner-box-guest .owner-contact-chevron {
    width: auto;
    flex: 0 0 auto;
    margin-left: auto;
    color: #8492a6;
    font-size: 14px;
}

@media (max-width: 1100px) and (min-width: 641px) {
    .property-detail-page .owner-box {
        width: min(100%, 620px);
        margin-inline: auto;
    }
}

@media (max-width: 640px) {
    .property-detail-page .owner-box {
        padding: 21px 18px;
        border-radius: 18px;
    }

    .property-detail-page .owner-avatar {
        width: 72px;
        height: 72px;
        font-size: 28px;
    }

    .property-detail-page .owner-avatar-wrap {
        width: 72px;
        height: 72px;
    }

    .property-detail-page .owner-box-guest .owner-avatar-wrap,
    .property-detail-page .owner-box-guest .owner-avatar {
        width: 84px;
        height: 84px;
    }

    .property-detail-page .owner-box-guest .owner-avatar {
        font-size: 34px;
    }

    .property-detail-page .owner-box-guest .masked-phone-box {
        padding: 14px;
    }

    .property-detail-page .masked-phone-summary {
        align-items: center;
    }

    .property-detail-page .masked-phone-copy strong {
        font-size: 18px;
    }

    .property-detail-page .owner-contact-action {
        min-height: 50px;
        padding-inline: 14px;
    }
}

/* Property detail sidebar information, report and fraud warning cards. */
.property-detail-page .listing-meta-card,
.property-detail-page .property-issue-card,
.property-detail-page .safety-warning-card {
    padding: 20px;
    border-radius: 18px;
}

.property-detail-page .sidebar-card-heading {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 14px;
}

.property-detail-page .sidebar-card-heading h3 {
    margin: 0;
    color: var(--text);
    font-size: 18px;
    line-height: 1.35;
}

.property-detail-page .sidebar-card-icon {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    flex: 0 0 34px;
    border-radius: 10px;
    font-size: 17px;
}

.property-detail-page .sidebar-card-icon-blue {
    border: 1px solid #bae0ff;
    background: #f2f9ff;
    color: #087fe3;
}

.property-detail-page .sidebar-card-icon-neutral {
    border: 1px solid #dce5ef;
    background: #f8fafc;
    color: #26384f;
}

.property-detail-page .listing-meta-list {
    margin: 0 0 18px;
}

.property-detail-page .listing-meta-list > div {
    display: grid;
    grid-template-columns: minmax(94px, .8fr) minmax(0, 1.2fr);
    gap: 12px;
    padding: 13px 0;
    border-bottom: 1px solid #e5edf5;
}

.property-detail-page .listing-meta-list > div:first-child {
    padding-top: 7px;
}

.property-detail-page .listing-meta-list dt,
.property-detail-page .listing-meta-list dd {
    margin: 0;
    line-height: 1.55;
}

.property-detail-page .listing-meta-list dt {
    color: #46586d;
    font-weight: 800;
}

.property-detail-page .listing-meta-list dd {
    min-width: 0;
    color: #24364c;
    overflow-wrap: anywhere;
}

.property-detail-page .sidebar-outline-action {
    min-height: 46px;
    gap: 9px;
    border: 1px solid #59adf2;
    border-radius: 10px;
    background: var(--white);
    color: #0877d1;
    box-shadow: none;
}

.property-detail-page .sidebar-outline-action:hover {
    border-color: #238fdf;
    background: #f2f9ff;
    color: #066bbd;
    box-shadow: 0 7px 16px rgba(8, 119, 209, .09);
}

.property-detail-page .property-issue-card {
    border-color: #e2e8f0;
    background: var(--white);
}

.property-detail-page .property-issue-card > p {
    margin: 0 0 17px;
    color: #65758a;
    font-size: 15px;
    line-height: 1.8;
}

.property-detail-page .safety-warning-card {
    border: 1px solid #fec6bb;
    background: linear-gradient(180deg, #fffaf8 0%, #fff 100%);
    box-shadow: 0 8px 24px rgba(194, 65, 12, .05);
}

.property-detail-page .safety-warning-heading {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 14px;
}

.property-detail-page .safety-warning-icon {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    flex: 0 0 36px;
    border-radius: 10px;
    background: #f04420;
    color: var(--white);
    font-size: 18px;
    box-shadow: 0 7px 15px rgba(240, 68, 32, .2);
}

.property-detail-page .safety-warning-card h3 {
    margin: 0;
    color: #d92d20;
    font-size: 18px;
    line-height: 1.35;
}

.property-detail-page .safety-warning-card > p {
    margin: 0 0 12px;
    color: #5d4039;
    font-size: 15px;
    line-height: 1.8;
}

.property-detail-page .safety-warning-card ul {
    display: grid;
    gap: 7px;
    margin: 0 0 16px;
    padding-left: 20px;
    color: #b42318;
    font-size: 14px;
    line-height: 1.75;
}

.property-detail-page .safety-warning-card small {
    display: block;
    padding-top: 14px;
    border-top: 1px solid #f3d4ce;
    color: #536273;
    font-size: 13px;
    line-height: 1.75;
}

@media (max-width: 640px) {
    .property-detail-page .listing-meta-card,
    .property-detail-page .property-issue-card,
    .property-detail-page .safety-warning-card {
        padding: 18px;
        border-radius: 16px;
    }

    .property-detail-page .listing-meta-list > div {
        grid-template-columns: minmax(88px, .7fr) minmax(0, 1.3fr);
    }

    .property-detail-page .sidebar-outline-action {
        width: 100%;
        min-height: 48px;
    }
}

/* Floating contact controls: back-to-top above LINE, matching the reference layout. */
button.back-to-top {
    right: 35px;
    bottom: 96px;
    width: 48px;
    height: 48px;
    background: #168fd7;
    box-shadow: 0 12px 30px rgba(22, 143, 215, .30);
}

button.back-to-top > i {
    font-size: 19px;
}

button.back-to-top:hover {
    background: #087fca;
    transform: translateY(-2px);
    box-shadow: 0 16px 34px rgba(22, 143, 215, .38);
}

a.floating-line-ad {
    right: 31px;
    bottom: 28px;
    width: 56px;
    height: 56px;
    overflow: visible;
    border: 0;
    border-radius: 14px;
    background: transparent;
    box-shadow: 0 12px 30px rgba(6, 199, 85, .27);
}

a.floating-line-ad > .floating-line-logo {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 12px;
    object-fit: cover;
}

a.floating-line-ad > .floating-line-label {
    display: block;
    position: absolute;
    top: 50%;
    right: calc(100% + 18px);
    width: max-content;
    padding: 16px 24px;
    border-radius: 16px;
    background: #fff;
    color: #27364d;
    box-shadow: 0 8px 28px rgba(40, 66, 92, .12);
    font-size: 18px;
    font-weight: 800;
    line-height: 1.25;
    opacity: 0;
    visibility: hidden;
    transform: translate(8px, -50%);
    transition: opacity .18s ease, visibility .18s ease, transform .18s ease;
    pointer-events: none;
}

a.floating-line-ad:hover > .floating-line-label,
a.floating-line-ad:focus-visible > .floating-line-label {
    opacity: 1;
    visibility: visible;
    transform: translate(0, -50%);
}

a.floating-line-ad > .floating-line-label::after {
    content: "";
    position: absolute;
    top: 50%;
    right: -12px;
    border-width: 10px 0 10px 13px;
    border-style: solid;
    border-color: transparent transparent transparent #fff;
    transform: translateY(-50%);
}

@media (max-width: 620px) {
    button.back-to-top {
        right: 21px;
        bottom: 142px;
        width: 44px;
        height: 44px;
    }

    button.back-to-top > i {
        font-size: 18px;
    }

    a.floating-line-ad {
        right: 14px;
        bottom: 72px;
        width: 58px;
        height: 58px;
        border-radius: 12px;
    }

    a.floating-line-ad > .floating-line-logo {
        border-radius: 12px;
    }

    a.floating-line-ad > .floating-line-label {
        right: calc(100% + 13px);
        padding: 12px 16px;
        border-radius: 13px;
        font-size: 14px;
    }
}

@media (max-width: 390px) {
    a.floating-line-ad > .floating-line-label {
        display: none;
    }
}

/* Home recommendation province configuration */
.recommend-province-config-list{display:grid;gap:10px}.recommend-province-config-row{display:grid;grid-template-columns:minmax(180px,1fr) minmax(190px,260px) 110px;align-items:end;gap:14px;padding:14px;border:1px solid #e3edf5;border-radius:15px;background:#fbfdff}.recommend-province-config-row>div{align-self:center}.recommend-province-config-row strong,.recommend-province-config-row small{display:block}.recommend-province-config-row small{margin-top:4px;color:#718397}.recommend-province-config-row label{margin:0}.recommend-province-config-row label span{display:block;margin-bottom:6px;color:#60758a;font-size:12px;font-weight:800}.recommend-province-config-row select,.recommend-province-config-row input{width:100%}
@media(max-width:760px){.recommend-province-config-row{grid-template-columns:1fr 1fr}.recommend-province-config-row>div{grid-column:1/-1}}

/* Footer redesign: dark structured layout based on the approved visual. */
.site-footer {
    margin-top: 0;
    overflow: hidden;
    background:
        radial-gradient(circle at 8% 8%, rgba(13, 98, 184, .13), transparent 32%),
        linear-gradient(110deg, #0d1b31 0%, #0c192c 56%, #0b1729 100%);
    color: #dce5f2;
}

.site-footer .footer-transit {
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid rgba(190, 210, 234, .32);
    background:
        radial-gradient(circle at 4% 40%, rgba(23, 120, 214, .22), transparent 28%),
        linear-gradient(105deg, #062451 0%, #062d64 53%, #072550 100%);
}

.site-footer .footer-transit::before,
.site-footer .footer-transit::after {
    position: absolute;
    color: rgba(86, 161, 228, .09);
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    pointer-events: none;
}

.site-footer .footer-transit::before {
    content: "\f1ad";
    bottom: -25px;
    left: 4px;
    font-size: 92px;
}

.site-footer .footer-transit::after {
    content: "\f238";
    right: 12px;
    bottom: -30px;
    font-size: 152px;
    transform: skewX(-8deg);
}

.site-footer .footer-transit-inner {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 255px minmax(0, 1fr);
    gap: 16px 25px;
    padding-top: 28px;
    padding-bottom: 22px;
}

.site-footer .footer-transit-heading {
    display: flex;
    align-items: center;
    gap: 15px;
}

.site-footer .footer-transit-heading-icon {
    display: grid;
    width: 74px;
    height: 74px;
    flex: 0 0 74px;
    place-items: center;
    border: 8px solid rgba(255, 255, 255, .68);
    border-radius: 50%;
    background: #fff;
    color: #1668c3;
    box-shadow: 0 9px 24px rgba(0, 0, 0, .22);
    font-size: 31px;
}

.site-footer .footer-transit-heading h2 {
    margin: 0 0 5px;
    color: #fff;
    font-size: 18px;
    line-height: 1.35;
}

.site-footer .footer-transit-heading p {
    margin: 0;
    color: #cddcf0;
    font-size: 12px;
    line-height: 1.55;
}

.site-footer .footer-transit-types {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 8px;
    min-width: 0;
}

.site-footer .footer-transit-type {
    display: grid;
    min-width: 0;
    min-height: 112px;
    align-items: center;
    align-content: center;
    justify-content: center;
    gap: 5px;
    padding: 10px 6px 9px;
    border: 1px solid rgba(222, 233, 247, .88);
    border-radius: 11px;
    background: #fff;
    color: #17253a;
    box-shadow: 0 7px 18px rgba(0, 0, 0, .13);
    text-decoration: none;
    transition: transform .18s ease, box-shadow .18s ease;
}

.site-footer .footer-transit-type:hover,
.site-footer .footer-transit-type:focus-visible {
    color: #17253a;
    box-shadow: 0 11px 24px rgba(0, 0, 0, .20);
    transform: translateY(-2px);
}

.site-footer .footer-transit-type > span {
    display: grid;
    width: 34px;
    height: 34px;
    margin: 0 auto 2px;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    font-size: 15px;
}

.site-footer .footer-transit-type strong {
    display: block;
    font-size: 12px;
    line-height: 1.25;
    text-align: center;
    white-space: normal;
}

.site-footer .footer-transit-type small {
    display: block;
    color: #718096;
    font-size: 9px;
    line-height: 1.25;
    text-align: center;
    white-space: normal;
}

.site-footer .footer-transit-type .is-green { background: #5baa3b; }
.site-footer .footer-transit-type .is-blue { background: #2467c4; }
.site-footer .footer-transit-type .is-pink { background: #e84762; }
.site-footer .footer-transit-type .is-red { background: #cf2945; }
.site-footer .footer-transit-type .is-orange { background: #f29a20; }
.site-footer .footer-transit-type .is-cyan { background: #3478d5; }
.site-footer .footer-transit-type .is-purple { background: #7545c5; }

.site-footer .footer-popular-stations {
    grid-column: 2;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 19px;
    align-items: center;
    min-width: 0;
    padding: 12px 17px;
    border-radius: 12px;
    background: rgba(25, 75, 139, .47);
}

.site-footer .footer-popular-label {
    display: flex;
    align-items: center;
    gap: 9px;
    white-space: nowrap;
}

.site-footer .footer-popular-label i {
    color: #ff9f21;
}

.site-footer .footer-popular-label strong {
    color: #fff;
    font-size: 13px;
}

.site-footer .footer-station-links {
    display: flex;
    min-width: 0;
    gap: 12px;
    overflow-x: auto;
    scrollbar-width: none;
}

.site-footer .footer-station-links::-webkit-scrollbar {
    display: none;
}

.site-footer .footer-station-links a {
    min-width: 78px;
    padding: 6px 12px;
    border: 1px solid rgba(196, 217, 241, .35);
    border-radius: 8px;
    color: #eef5ff;
    font-size: 12px;
    line-height: 1;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
}

.site-footer .footer-station-links a:hover,
.site-footer .footer-station-links a:focus-visible {
    border-color: rgba(255, 255, 255, .72);
    background: rgba(255, 255, 255, .11);
    color: #fff;
}

.site-footer .footer-stations-all {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #e9f3ff;
    font-size: 12px;
    text-decoration: none;
    white-space: nowrap;
}

.site-footer .footer-stations-all:hover,
.site-footer .footer-stations-all:focus-visible {
    color: #fff;
}

.site-footer .footer-main {
    padding: 40px 0 31px;
}

.site-footer .footer-grid {
    grid-template-columns: minmax(250px, 1.45fr) repeat(4, minmax(135px, 1fr));
    gap: 0;
}

.site-footer .footer-col {
    min-width: 0;
    padding: 0 48px;
}

.site-footer .footer-col:first-child {
    padding-left: 0;
}

.site-footer .footer-col:last-child {
    padding-right: 0;
}

.site-footer .footer-col + .footer-col {
    border-left: 1px solid rgba(190, 210, 234, .22);
}

.site-footer .footer-logo.footer-brand-demo {
    display: block;
    max-width: 285px;
    margin: 0 0 17px;
}

.site-footer .footer-logo.footer-brand-demo img {
    width: 100% !important;
    height: auto !important;
    max-height: 76px !important;
    object-fit: contain;
    object-position: left center;
}

.site-footer .footer-about > p {
    max-width: 300px;
    margin: 0 0 20px;
    color: #eef4fc;
    font-size: 14px;
    line-height: 1.75;
}

.site-footer .footer-col h3 {
    margin: 2px 0 17px;
    color: #fff;
    font-size: 18px;
    font-weight: 800;
    line-height: 1.35;
}

.site-footer .footer-col li {
    margin: 0 0 10px;
    line-height: 1.45;
}

.site-footer .footer-col a {
    color: #dce5f2;
    font-size: 15px;
    text-decoration: none;
    transition: color .18s ease;
}

.site-footer .footer-col a:hover,
.site-footer .footer-col a:focus-visible {
    color: #26bdf0;
}

.site-footer .footer-contact {
    display: grid;
    gap: 11px;
}

.site-footer .footer-contact p {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    margin: 0;
    color: #e8eef8;
    font-size: 14px;
    line-height: 1.5;
}

.site-footer .footer-contact p > i {
    width: 20px;
    margin-top: 2px;
    color: #e8eef8;
    font-size: 17px;
    text-align: center;
}

.site-footer .footer-contact strong {
    color: #fff;
}

.site-footer .footer-contact a {
    font-size: inherit;
}

.site-footer .footer-social-icons {
    display: flex;
    flex-wrap: wrap;
    gap: 13px;
    margin-top: 20px;
}

.site-footer .footer-social-icons a {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    font-size: 19px;
    box-shadow: 0 7px 18px rgba(0, 0, 0, .18);
    transition: transform .18s ease, filter .18s ease;
}

.site-footer .footer-social-icons a:hover,
.site-footer .footer-social-icons a:focus-visible {
    color: #fff;
    filter: brightness(1.12);
    transform: translateY(-2px);
}

.site-footer .footer-social-icons .is-facebook { background: #3568ad; }
.site-footer .footer-social-icons .is-youtube { background: #e5393f; }
.site-footer .footer-social-icons .is-tiktok { background: #05070b; }
.site-footer .footer-social-icons .is-line { background: #18c957; }

.site-footer .footer-bottom {
    border-top: 1px solid rgba(190, 210, 234, .20);
    padding: 19px 0 20px;
}

.site-footer .footer-bottom p,
.site-footer .footer-bottom a {
    color: #e4ebf5;
    font-size: 14px;
}

.site-footer .footer-social {
    gap: 23px;
}

@media (max-width: 1180px) {
    .site-footer .footer-transit-inner {
        grid-template-columns: 230px minmax(0, 1fr);
    }

    .site-footer .footer-transit-types {
        display: flex;
        overflow-x: auto;
        padding-bottom: 4px;
        scrollbar-width: thin;
    }

    .site-footer .footer-transit-type {
        min-width: 118px;
    }

    .site-footer .footer-col {
        padding-right: 27px;
        padding-left: 27px;
    }
}

@media (max-width: 980px) {
    .site-footer .footer-transit-inner {
        grid-template-columns: 1fr;
    }

    .site-footer .footer-transit-heading {
        max-width: 390px;
    }

    .site-footer .footer-popular-stations {
        grid-column: 1;
    }

    .site-footer .footer-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        row-gap: 36px;
    }

    .site-footer .footer-col,
    .site-footer .footer-col:first-child,
    .site-footer .footer-col:last-child {
        padding: 0 28px;
    }

    .site-footer .footer-col:nth-child(odd) {
        padding-left: 0;
        border-left: 0;
    }

    .site-footer .footer-col:nth-child(even) {
        padding-right: 0;
        border-left: 1px solid rgba(190, 210, 234, .22);
    }
}

@media (max-width: 620px) {
    .site-footer .footer-transit-inner {
        gap: 17px;
        padding-top: 24px;
        padding-bottom: 20px;
    }

    .site-footer .footer-transit-heading-icon {
        width: 62px;
        height: 62px;
        flex-basis: 62px;
        border-width: 6px;
        font-size: 25px;
    }

    .site-footer .footer-transit-heading h2 {
        font-size: 17px;
    }

    .site-footer .footer-transit-type {
        min-width: 125px;
        min-height: 106px;
    }

    .site-footer .footer-popular-stations {
        grid-template-columns: 1fr auto;
        gap: 12px;
        padding: 13px;
    }

    .site-footer .footer-station-links {
        grid-column: 1 / -1;
        grid-row: 2;
    }

    .site-footer .footer-main {
        padding: 34px 0 27px;
    }

    .site-footer .footer-grid {
        grid-template-columns: 1fr !important;
        gap: 0;
    }

    .site-footer .footer-col,
    .site-footer .footer-col:first-child,
    .site-footer .footer-col:last-child,
    .site-footer .footer-col:nth-child(even),
    .site-footer .footer-col:nth-child(odd) {
        padding: 24px 0;
        border-left: 0;
        border-top: 1px solid rgba(190, 210, 234, .18);
    }

    .site-footer .footer-col:first-child {
        padding-top: 0;
        border-top: 0;
    }

    .site-footer .footer-col h3 {
        margin-top: 0;
        margin-bottom: 13px;
    }

    .site-footer .footer-logo.footer-brand-demo {
        max-width: 255px;
    }

    .site-footer .footer-bottom-inner {
        display: flex;
        align-items: center;
        flex-direction: column;
        text-align: center;
    }

    .site-footer .footer-social {
        margin-top: 0;
    }
}

/* Property issue report modal */
body.modal-open{overflow:hidden}
.issue-report-modal{
    padding:clamp(16px,3vw,42px);
}
.issue-report-backdrop{
    background:rgba(22,45,76,.62);
    -webkit-backdrop-filter:blur(9px);
    backdrop-filter:blur(9px);
}
.issue-report-dialog{
    width:min(1040px,100%);
    max-height:min(92vh,880px);
    padding:34px 40px 28px;
    border:1px solid rgba(255,255,255,.8);
    border-radius:24px;
    background:#fff;
    box-shadow:0 36px 100px rgba(15,35,64,.32);
}
.issue-report-close{
    top:30px;
    right:32px;
    width:48px;
    height:48px;
    border:1px solid #dbe4ef;
    background:#fff;
    color:#17253b;
    font-size:20px;
    transition:border-color .2s ease,background .2s ease,transform .2s ease;
}
.issue-report-close:hover{
    border-color:#b9c8da;
    background:#f6f9fc;
    transform:rotate(4deg);
}
.issue-report-close:focus-visible,
.issue-report-form select:focus-visible,
.issue-report-form input:focus-visible,
.issue-report-form textarea:focus-visible{
    outline:3px solid rgba(14,151,238,.18);
    outline-offset:1px;
    border-color:#1598ef;
}
.issue-report-head{
    gap:22px;
    padding-right:68px;
    margin-bottom:28px;
}
.issue-report-icon{
    width:74px;
    height:74px;
    flex:0 0 74px;
    border:1px solid #ffd9c8;
    border-radius:20px;
    background:linear-gradient(145deg,#fff6f2,#fffaf8);
    color:#f05223;
    font-size:31px;
}
.issue-report-head h2{
    color:#17253b;
    font-size:clamp(25px,2.4vw,34px);
    line-height:1.25;
}
.issue-report-head p{
    margin-top:5px;
    color:#8a98ad;
    font-size:17px;
}
.issue-report-form{
    display:grid;
    gap:20px;
}
.issue-report-form .form-group{
    min-width:0;
    margin:0;
}
.issue-report-form label,
.issue-contact-section legend{
    display:block;
    margin:0 0 9px;
    color:#183a61;
    font-size:15px;
    font-weight:800;
}
.issue-select-wrap,
.issue-input-wrap,
.issue-message-wrap{
    position:relative;
}
.issue-report-form select,
.issue-report-form input,
.issue-report-form textarea{
    width:100%;
    border:1px solid #ced9e5;
    border-radius:11px;
    background:#fff;
    color:#35465e;
    font:inherit;
    box-shadow:0 3px 10px rgba(34,67,102,.06);
    transition:border-color .2s ease,box-shadow .2s ease;
}
.issue-report-form select:hover,
.issue-report-form input:hover,
.issue-report-form textarea:hover{
    border-color:#aebfd1;
}
.issue-report-form select,
.issue-report-form input{
    height:58px;
}
.issue-report-form select{
    padding:0 46px 0 64px;
    cursor:pointer;
}
.issue-field-icon{
    position:absolute;
    z-index:1;
    top:50%;
    left:14px;
    display:grid;
    width:36px;
    height:36px;
    place-items:center;
    border-radius:50%;
    background:#eaf5ff;
    color:#0e91ec;
    font-size:16px;
    pointer-events:none;
    transform:translateY(-50%);
}
.issue-report-form textarea{
    min-height:132px;
    padding:16px 18px 35px;
    line-height:1.65;
    resize:vertical;
}
.issue-char-count{
    position:absolute;
    right:15px;
    bottom:11px;
    color:#718198;
    font-size:12px;
    pointer-events:none;
}
.issue-char-count b{font-weight:500}
.issue-contact-section{
    min-width:0;
    padding:0;
    border:0;
    margin:0;
}
.issue-contact-section legend{
    width:100%;
    padding:0;
    margin-bottom:10px;
}
.issue-contact-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
}
.issue-input-icon{
    position:absolute;
    z-index:1;
    top:50%;
    left:16px;
    color:#73839a;
    font-size:18px;
    pointer-events:none;
    transform:translateY(-50%);
}
.issue-report-form .issue-input-wrap input{
    padding:0 14px 0 48px;
}
.issue-submit-button{
    display:flex;
    min-height:60px;
    align-items:center;
    justify-content:center;
    gap:14px;
    margin-top:2px;
    border:0;
    border-radius:10px;
    background:linear-gradient(100deg,#0ca8ee 0%,#0967f1 100%);
    box-shadow:0 10px 22px rgba(9,115,239,.22);
    font-size:17px;
    font-weight:800;
}
.issue-submit-button:hover{
    background:linear-gradient(100deg,#069de2 0%,#075bdc 100%);
    box-shadow:0 12px 26px rgba(9,115,239,.28);
    transform:translateY(-1px);
}
.issue-privacy-note{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    margin:-2px 0 0;
    color:#8997aa;
    font-size:13px;
    text-align:center;
}
.issue-privacy-note i{font-size:12px}

@media(max-width:760px){
    .issue-report-modal{padding:10px}
    .issue-report-dialog{
        max-height:calc(100vh - 20px);
        padding:22px 18px 18px;
        border-radius:18px;
    }
    .issue-report-close{
        top:17px;
        right:16px;
        width:40px;
        height:40px;
        font-size:17px;
    }
    .issue-report-head{
        align-items:flex-start;
        gap:13px;
        padding-right:45px;
        margin-bottom:22px;
    }
    .issue-report-icon{
        width:52px;
        height:52px;
        flex-basis:52px;
        border-radius:15px;
        font-size:23px;
    }
    .issue-report-head h2{font-size:22px}
    .issue-report-head p{font-size:14px;line-height:1.45}
    .issue-report-form{gap:17px}
    .issue-contact-grid{grid-template-columns:1fr;gap:14px}
    .issue-report-form select,
    .issue-report-form input{height:52px}
    .issue-report-form textarea{min-height:120px}
    .issue-submit-button{min-height:54px;font-size:16px}
    .issue-privacy-note{align-items:flex-start;font-size:12px;line-height:1.5}
}

/* Nearby place category editor */
.nearby-category-form-card {
    padding: 30px 32px 28px;
}

.nearby-category-form-header {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 28px;
}

.nearby-category-form-icon {
    display: grid;
    width: 58px;
    height: 58px;
    flex: 0 0 58px;
    place-items: center;
    border-radius: 50%;
    background: linear-gradient(145deg, #eef8ff, #e1f0ff);
    color: var(--primary-dark);
    font-size: 25px;
}

.nearby-category-form-heading {
    min-width: 0;
}

.nearby-category-form-heading .section-title {
    font-size: 26px;
}

.nearby-category-form {
    display: grid;
    grid-template-columns: minmax(180px, 1.05fr) minmax(180px, 1fr) minmax(220px, 1.25fr) 90px 100px;
    gap: 18px 20px;
    align-items: start;
}

.nearby-category-field label {
    display: flex;
    min-height: 22px;
    align-items: center;
    gap: 9px;
    white-space: nowrap;
}

.nearby-category-field label i {
    width: 18px;
    color: var(--primary-dark);
    text-align: center;
}

.nearby-category-field input,
.nearby-category-field select {
    min-height: 48px;
}

.nearby-category-upload {
    display: flex;
    grid-column: 1 / -1;
    min-height: 82px;
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding: 16px 24px;
    border: 1.5px solid #93c5fd;
    border-radius: 12px;
    background: linear-gradient(100deg, #f4faff, #eef7ff);
    color: var(--text);
    cursor: pointer;
    text-align: left;
    transition: .2s ease;
}

.nearby-category-upload:hover,
.nearby-category-upload:focus-within,
.nearby-category-upload.is-dragging {
    border-color: var(--primary);
    background: var(--primary-light);
    box-shadow: 0 0 0 4px rgba(14, 165, 233, .1);
}

.nearby-category-upload input {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    opacity: 0;
}

.nearby-category-upload-icon {
    color: var(--secondary);
    font-size: 25px;
}

.nearby-category-upload strong,
.nearby-category-upload small {
    display: block;
}

.nearby-category-upload strong {
    color: var(--primary-dark);
    font-size: 15px;
}

.nearby-category-upload small {
    margin-top: 3px;
    color: var(--text-muted);
    font-size: 12px;
}

.nearby-category-icon-preview {
    width: 48px;
    height: 48px;
    margin-left: 10px;
    border-radius: 12px;
    background: #fff;
    object-fit: contain;
    padding: 5px;
    box-shadow: var(--shadow-sm);
}

.nearby-category-actions {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-left: auto;
    padding: 0;
}

.nearby-category-actions .btn {
    min-width: 140px;
    border-radius: 10px;
}

.nearby-category-search {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) 220px 120px;
    gap: 16px;
    align-items: end;
    margin-top: 18px;
    padding-top: 0;
    border-top: 0;
}

.nearby-category-search .form-group {
    min-width: 0;
}

.nearby-category-search label {
    display: flex;
    align-items: center;
    gap: 8px;
}

.nearby-category-search label i {
    color: var(--primary-dark);
}

.nearby-category-search .search-input-wrap {
    position: relative;
}

.nearby-category-search .search-input-wrap i {
    position: absolute;
    top: 50%;
    left: 15px;
    color: #3b82f6;
    transform: translateY(-50%);
    pointer-events: none;
}

.nearby-category-search .search-input-wrap input {
    min-height: 48px;
    padding-left: 44px;
}

.nearby-category-search select,
.nearby-category-search .btn {
    min-height: 48px;
}

.nearby-category-search .btn {
    width: 100%;
    border-radius: 10px;
}

@media (max-width: 820px) {
    .nearby-category-form-card {
        padding: 24px 20px;
    }
    .nearby-category-form {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .nearby-category-field-name,
    .nearby-category-field-slug,
    .nearby-category-field-icon {
        grid-column: 1 / -1;
    }
    .nearby-category-field-order,
    .nearby-category-field-status {
        grid-column: span 1;
    }
    .nearby-category-search {
        grid-template-columns: minmax(0, 1fr) minmax(150px, .55fr);
    }
    .nearby-category-search-submit {
        grid-column: 1 / -1;
    }
    .nearby-category-search-submit .btn {
        width: auto;
        min-width: 140px;
    }
}

@media (max-width: 520px) {
    .nearby-category-form-header {
        align-items: flex-start;
        flex-wrap: wrap;
    }
    .nearby-category-form-heading .section-title {
        font-size: 22px;
    }
    .nearby-category-upload {
        align-items: flex-start;
        padding: 16px;
    }
    .nearby-category-icon-preview {
        display: none;
    }
    .nearby-category-actions,
    .nearby-category-actions .btn {
        width: 100%;
    }
    .nearby-category-actions {
        flex-direction: column-reverse;
        margin-left: 0;
    }
    .nearby-category-search {
        grid-template-columns: 1fr;
    }
    .nearby-category-search-submit {
        grid-column: auto;
    }
    .nearby-category-search-submit .btn {
        width: 100%;
    }
}

/* Keep the drawer rules after legacy responsive declarations so they win the cascade. */
@media (max-width: 900px) {
    .admin-sidebar {
        position: fixed !important;
        inset: 0 auto 0 0 !important;
        z-index: 1200;
        width: min(86vw, 340px) !important;
        height: 100dvh !important;
        min-height: 100vh !important;
        padding: 20px 16px !important;
        overflow-x: hidden;
        overflow-y: auto;
        transform: translateX(-105%);
        visibility: hidden;
    }

    .admin-sidebar-open .admin-sidebar {
        transform: translateX(0);
        visibility: visible;
    }

    .admin-sidebar .admin-nav {
        display: grid !important;
        gap: 6px;
        padding: 0 0 18px;
        overflow: visible;
    }

    .admin-sidebar .admin-nav a {
        width: 100%;
        white-space: normal;
        padding: 10px 12px !important;
    }
}