/* HomeofIndia Services — professional dashboard-inspired UI */
:root {
    --svc-ink: #14213d;
    --svc-muted: #667085;
    --svc-line: #e6eaf0;
    --svc-bg: #f6f8fc;
    --svc-brand: #0f766e;
    --svc-brand2: #115e59;
    --svc-accent: #f59e0b;
    --svc-white: #fff;
    --svc-shadow: 0 12px 34px rgba(16,24,40,.08)
}

.hoi-services {
    background: var(--svc-bg);
    min-height: 70vh;
    color: var(--svc-ink);
    font-family: "Source Sans Pro",system-ui,-apple-system,sans-serif
}

.svc-wrap {
    max-width: 1220px;
    margin: auto;
    padding: 30px 18px 48px
}

.svc-hero {
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg,#0b5d57,#0f766e 58%,#149184);
    color: #fff;
    border-radius: 24px;
    padding: 42px;
    box-shadow: 0 18px 45px rgba(15,118,110,.18)
}

.svc-hero:after {
    content: "";
    position: absolute;
    width: 260px;
    height: 260px;
    border-radius: 50%;
    right: -80px;
    top: -90px;
    background: rgba(255,255,255,.09)
}

.svc-hero h1 {
    font-size: clamp(2rem,4vw,3.2rem);
    font-weight: 800;
    letter-spacing: -.02em;
    margin: 0 0 9px
}

.svc-hero p {
    max-width: 720px;
    font-size: 1.08rem;
    opacity: .94
}

.svc-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: .78rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .08em;
    margin-bottom: 9px
}

.svc-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    margin-bottom: 22px
}

.svc-title {
    font-size: 1.9rem;
    font-weight: 800;
    letter-spacing: -.02em
}

.svc-muted {
    color: var(--svc-muted)
}

.svc-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border: 0;
    border-radius: 11px;
    padding: 10px 15px;
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
    transition: .18s ease
}

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

.svc-btn-primary {
    background: var(--svc-accent);
    color: #172033
}

.svc-btn-dark {
    background: #14213d;
    color: #fff
}

.svc-btn-light {
    background: #fff;
    color: var(--svc-brand);
    border: 1px solid var(--svc-line)
}

.svc-section {
    padding: 30px 0
}

.svc-grid {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 16px;
    margin-top: 18px
}

.svc-card,.svc-panel,.svc-form,.svc-stat {
    background: #fff;
    border: 1px solid var(--svc-line);
    border-radius: 18px;
    box-shadow: var(--svc-shadow)
}

.svc-card {
    padding: 20px;
    text-decoration: none;
    color: inherit;
    transition: .2s ease
}

.svc-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 40px rgba(16,24,40,.12);
    border-color: #cbd5e1
}

.svc-card i {
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    border-radius: 13px;
    background: #ecfdf5;
    color: var(--svc-brand);
    font-size: 1.35rem
}

.svc-card h3 {
    font-size: 1.08rem;
    font-weight: 800;
    margin: 13px 0 5px
}

.svc-panel,.svc-form {
    padding: 22px
}

.svc-stats {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 14px;
    margin-bottom: 22px
}

.svc-stat {
    position: relative;
    padding: 19px;
    overflow: hidden
}

.svc-stat span {
    color: var(--svc-muted);
    font-weight: 600
}

.svc-stat strong {
    display: block;
    font-size: 2rem;
    line-height: 1.15;
    margin-top: 5px
}

.svc-stat i {
    position: absolute;
    right: 16px;
    top: 17px;
    font-size: 1.5rem;
    color: var(--svc-brand);
    opacity: .22
}

.svc-form-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 15px
}

.svc-full {
    grid-column: 1/-1
}

.svc-field label {
    display: block;
    font-weight: 700;
    margin-bottom: 6px
}

.svc-field input,.svc-field select,.svc-field textarea {
    width: 100%;
    border: 1px solid #d0d5dd;
    background: #fff;
    border-radius: 11px;
    padding: 11px 12px;
    outline: 0;
    transition: .15s
}

.svc-field input:focus,.svc-field select:focus,.svc-field textarea:focus {
    border-color: #2aa198;
    box-shadow: 0 0 0 3px rgba(15,118,110,.10)
}

.svc-field textarea {
    min-height: 125px;
    resize: vertical
}

.svc-table-wrap {
    overflow: auto;
    border-radius: 14px
}

.svc-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0
}

.svc-table th {
    background: #f8fafc;
    color: #475467;
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .04em
}

.svc-table th,.svc-table td {
    padding: 12px 13px;
    border-bottom: 1px solid #edf0f4;
    text-align: left;
    vertical-align: middle
}

.svc-table tbody tr:hover {
    background: #fbfcfe
}

.svc-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border-radius: 999px;
    padding: 5px 9px;
    background: #f2f4f7;
    color: #344054;
    font-size: .78rem;
    font-weight: 800
}

.svc-alert {
    padding: 12px 14px;
    border-radius: 11px;
    margin-bottom: 15px
}

.svc-success {
    background: #ecfdf3;
    color: #067647
}

.svc-error {
    background: #fef3f2;
    color: #b42318
}

.svc-provider {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: center
}

.svc-footer-note {
    margin-top: 22px;
    color: var(--svc-muted);
    font-size: .9rem
}

.svc-admin-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    background: linear-gradient(135deg,#14213d,#23375d);
    color: #fff;
    border-radius: 22px;
    padding: 27px 30px;
    margin-bottom: 22px;
    box-shadow: var(--svc-shadow)
}

.svc-admin-hero .svc-title {
    color: #fff
}

.svc-admin-icon {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    border-radius: 16px;
    background: rgba(255,255,255,.12);
    font-size: 1.7rem
}

.svc-admin-copy {
    display: flex;
    align-items: center;
    gap: 15px
}

.svc-admin-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap
}

@media(max-width: 900px) {
    .svc-grid {
        grid-template-columns:repeat(2,1fr)
    }

    .svc-stats {
        grid-template-columns: repeat(2,1fr)
    }

    .svc-admin-hero {
        align-items: flex-start;
        flex-direction: column
    }
}

@media(max-width: 600px) {
    .svc-wrap {
        padding:18px 11px 35px
    }

    .svc-hero {
        padding: 28px 20px;
        border-radius: 18px
    }

    .svc-grid,.svc-stats,.svc-form-grid {
        grid-template-columns: 1fr
    }

    .svc-full {
        grid-column: auto
    }

    .svc-top,.svc-provider {
        align-items: flex-start;
        flex-direction: column
    }

    .svc-card,.svc-panel,.svc-form {
        border-radius: 15px
    }

    .svc-admin-hero {
        padding: 20px
    }

    .svc-admin-copy {
        align-items: flex-start
    }

    .svc-table {
        min-width: 720px
    }
}

/* =========================================================
   Service Provider Registration
   Moved from provider/register.php
   ========================================================= */
.provider-page {
    background: #f6f8fc;
    min-height: 100vh;
    padding: 22px 16px 50px;
    color: #172033
}

.provider-shell {
    max-width: 1180px;
    margin: auto
}

.provider-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
    background: #fff;
    border: 1px solid #e4e9f1;
    border-radius: 14px;
    padding: 18px 22px;
    margin-bottom: 20px;
    box-shadow: 0 5px 18px rgba(15,23,42,.05)
}

.provider-title {
    display: flex;
    align-items: center;
    gap: 13px
}

.provider-title>i {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    border-radius: 11px;
    background: #eaf3ff;
    color: #1265d6;
    font-size: 1.25rem
}

.provider-title h1 {
    font-size: 1.3rem;
    margin: 0 0 3px;
    font-weight: 800
}

.provider-title p {
    margin: 0;
    color: #667085;
    font-size: .86rem
}

.provider-nav {
    display: flex;
    gap: 8px;
    flex-wrap: wrap
}

.provider-nav a {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 12px;
    border: 1px solid #d8e0eb;
    border-radius: 8px;
    color: #344054;
    background: #fff;
    text-decoration: none;
    font-size: .82rem;
    font-weight: 700
}

.provider-nav a:hover,.provider-nav a.active {
    background: #1265d6;
    border-color: #1265d6;
    color: #fff
}

.provider-layout {
    display: grid;
    grid-template-columns: minmax(0,1fr) 300px;
    gap: 20px
}

.provider-card,.side-card {
    background: #fff;
    border: 1px solid #e4e9f1;
    border-radius: 14px;
    box-shadow: 0 5px 18px rgba(15,23,42,.04)
}

.card-head {
    padding: 21px 23px 16px;
    border-bottom: 1px solid #edf0f5
}

.card-head small {
    color: #1265d6;
    font-weight: 800;
    letter-spacing: .07em
}

.card-head h2 {
    font-size: 1.3rem;
    margin: 5px 0
}

.card-head p {
    margin: 0;
    color: #667085;
    font-size: .86rem
}

.provider-alert {
    margin: 18px 23px 0;
    padding: 11px 13px;
    border-radius: 8px;
    font-size: .85rem
}

.success {
    background: #ecfdf3;
    color: #027a48;
    border: 1px solid #abefc6
}

.error {
    background: #fef3f2;
    color: #b42318;
    border: 1px solid #fecdca
}

.provider-form {
    padding: 21px 23px
}

.form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px
}

.field.full,.submit-row {
    grid-column: 1/-1
}

.field label {
    display: block;
    font-size: .82rem;
    font-weight: 700;
    margin-bottom: 6px
}

.field input,.field textarea {
    width: 100%;
    min-height: 44px;
    border: 1px solid #d7deea;
    border-radius: 8px;
    padding: 10px 11px;
    outline: 0
}

.field textarea {
    min-height: 115px;
    resize: vertical
}

.field input:focus,.field textarea:focus {
    border-color: #1265d6;
    box-shadow: 0 0 0 3px rgba(18,101,214,.08)
}

.service-checks {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px
}

.service-check {
    display: flex!important;
    align-items: center;
    gap: 8px;
    padding: 9px 10px;
    margin: 0!important;
    border: 1px solid #e4e9f1;
    border-radius: 8px;
    background: #fafcff;
    font-weight: 600!important;
    font-size: .8rem!important
}

.service-check input {
    width: 16px!important;
    height: 16px!important;
    min-height: 0!important;
    margin: 0;
    accent-color: #1265d6
}

.submit-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px
}

.submit-row span {
    font-size: .76rem;
    color: #667085
}

.submit-btn {
    border: 0;
    border-radius: 8px;
    background: #1265d6;
    color: #fff;
    padding: 11px 18px;
    font-weight: 800
}

.provider-side {
    display: flex;
    flex-direction: column;
    gap: 15px
}

.side-card {
    padding: 18px
}

.side-card h3 {
    font-size: 1rem;
    margin: 0 0 12px
}

.benefit {
    display: flex;
    gap: 10px;
    margin: 13px 0
}

.benefit i {
    width: 31px;
    height: 31px;
    flex: 0 0 31px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    background: #eef5ff;
    color: #1265d6
}

.benefit b {
    font-size: .82rem;
    display: block
}

.benefit span {
    font-size: .75rem;
    color: #667085;
    line-height: 1.35;
    display: block;
    margin-top: 2px
}

.home-link {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 7px;
    border: 1px solid #1265d6;
    border-radius: 8px;
    padding: 10px;
    color: #1265d6;
    text-decoration: none;
    font-weight: 800;
    font-size: .82rem
}

@media(max-width: 900px) {
    .provider-layout {
        grid-template-columns:1fr
    }

    .provider-head {
        align-items: flex-start;
        flex-direction: column
    }

    .provider-side {
        display: grid;
        grid-template-columns: 1fr 1fr
    }
}

@media(max-width: 650px) {
    .provider-page {
        padding:12px 10px 35px
    }

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

    .field.full,.submit-row {
        grid-column: 1
    }

    .service-checks {
        grid-template-columns: 1fr
    }

    .provider-form,.card-head {
        padding: 17px 14px
    }

    .provider-side {
        grid-template-columns: 1fr
    }

    .submit-row {
        flex-direction: column;
        align-items: stretch
    }

    .submit-btn {
        width: 100%
    }
}

/* Colorful HomeofIndia Services registration header */
.provider-head {
    position: relative;
    overflow: hidden;
    padding: 24px 26px;
    border: 0;
    background: radial-gradient(circle at 92% 12%,rgba(255,255,255,.22),transparent 24%), radial-gradient(circle at 62% 115%,rgba(63,211,198,.25),transparent 30%), linear-gradient(118deg,#0b3b91 0%,#1265d6 47%,#6546e8 100%);
    box-shadow: 0 14px 34px rgba(18,101,214,.22);
}

.provider-head:before {
    content: "";
    position: absolute;
    width: 180px;
    height: 180px;
    border-radius: 50%;
    right: -55px;
    top: -100px;
    background: rgba(255,255,255,.10);
}

.provider-head:after {
    content: "";
    position: absolute;
    width: 110px;
    height: 110px;
    border-radius: 50%;
    left: 42%;
    bottom: -82px;
    background: rgba(255,255,255,.09);
}

.provider-title,.provider-nav {
    position: relative;
    z-index: 1
}

.provider-title>i {
    width: 54px;
    height: 54px;
    color: #0b57c4;
    background: linear-gradient(145deg,#fff,#eaf4ff);
    border: 1px solid rgba(255,255,255,.7);
    box-shadow: 0 7px 18px rgba(0,0,0,.14);
    font-size: 1.45rem;
}

.provider-title h1 {
    color: #fff;
    font-size: 1.45rem;
    letter-spacing: -.01em
}

.provider-title p {
    color: rgba(255,255,255,.86);
    font-size: .88rem
}

.provider-nav a {
    color: #fff;
    border: 1px solid rgba(255,255,255,.32);
    background: rgba(255,255,255,.12);
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
}

.provider-nav a:hover {
    color: #123d84;
    background: #fff;
    border-color: #fff;
    transform: translateY(-1px);
}

.provider-nav a.active {
    color: #123d84;
    background: #fff;
    border-color: #fff;
    box-shadow: 0 5px 14px rgba(0,0,0,.12);
}

@media(max-width: 650px) {
    .provider-head {
        padding:19px 16px
    }

    .provider-title {
        align-items: flex-start
    }

    .provider-title>i {
        width: 46px;
        height: 46px;
        flex: 0 0 46px
    }

    .provider-title h1 {
        font-size: 1.18rem
    }

    .provider-nav {
        display: grid;
        grid-template-columns: 1fr;
        width: 100%
    }

    .provider-nav a {
        justify-content: center
    }
}

.provider-captcha {
    padding: 14px;
    border: 1px solid #dce6f3;
    border-radius: 10px;
    background: linear-gradient(135deg,#f8fbff,#f4f7ff)
}

.provider-captcha-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 7px 0 10px
}

.provider-captcha-code {
    min-width: 165px;
    padding: 10px 18px;
    border: 1px dashed #8bb5ec;
    border-radius: 8px;
    background: #fff;
    color: #173b70;
    font-size: 1.18rem;
    font-weight: 900;
    letter-spacing: .22em;
    text-align: center;
    user-select: none
}

.provider-captcha-refresh {
    width: 43px;
    height: 43px;
    border: 1px solid #cbdcf2;
    border-radius: 8px;
    background: #fff;
    color: #1265d6;
    display: grid;
    place-items: center;
    cursor: pointer
}

.provider-captcha-refresh:hover {
    background: #1265d6;
    color: #fff;
    border-color: #1265d6
}

.provider-captcha .captcha-input {
    max-width: 330px
}

@media(max-width: 650px) {
    .provider-captcha-code {
        min-width:0;
        flex: 1
    }

    .provider-captcha .captcha-input {
        max-width: none
    }
}

/* Request Service — uses Provider Registration as master UI */
.field select {
    width: 100%;
    min-height: 44px;
    border: 1px solid #d7deea;
    border-radius: 8px;
    padding: 10px 36px 10px 11px;
    outline: 0;
    background: #fff;
    color: #172033
}

.field select:focus {
    border-color: #1265d6;
    box-shadow: 0 0 0 3px rgba(18,101,214,.08)
}

/* =========================================================
   Service Category Page
   ========================================================= */
.service-category-page {
    padding-bottom: 42px
}

.category-hero-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    margin: 20px 0;
    background: #fff;
    border: 1px solid #e7ebf2;
    border-radius: 14px;
    padding: 26px;
    box-shadow: 0 8px 28px rgba(16,24,40,.06)
}

.category-kicker {
    display: block;
    color: #1265d6;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .09em;
    margin-bottom: 6px
}

.category-hero-card h2 {
    margin: 0 0 7px;
    color: #172033;
    font-size: 1.5rem
}

.category-hero-card p {
    margin: 0;
    color: #667085;
    line-height: 1.6;
    max-width: 720px
}

.category-trust {
    display: flex;
    flex-wrap: wrap;
    gap: 9px 18px;
    margin-top: 16px;
    color: #475467;
    font-size: .78rem;
    font-weight: 650
}

.category-trust i {
    color: #1265d6;
    margin-right: 4px
}

.category-request-btn {
    white-space: nowrap;
    text-decoration: none
}

.category-content {
    display: grid;
    grid-template-columns: minmax(0,1fr) 290px;
    gap: 20px;
    align-items: start
}

.category-providers {
    min-width: 0
}

.category-list-head {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 14px
}

.category-provider-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 14px;
    margin-top: 18px
}

.category-provider-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    border: 1px solid #e5eaf1;
    border-radius: 12px;
    background: #fff;
    overflow: hidden;
    transition: transform .18s ease,box-shadow .18s ease,border-color .18s ease
}

.category-provider-card:hover {
    transform: translateY(-2px);
    border-color: #cbd8ec;
    box-shadow: 0 10px 24px rgba(16,24,40,.08)
}

.category-provider-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    padding: 16px 16px 0
}

.category-provider-avatar {
    width: 48px;
    height: 48px;
    border-radius: 11px;
    display: grid;
    place-items: center;
    background: #eef5ff;
    color: #1265d6;
    font-size: 1.3rem
}

.category-provider-badges {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px
}

.category-provider-badges span {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    border-radius: 999px;
    padding: 5px 8px;
    font-size: .67rem;
    font-weight: 750
}

.category-provider-badges .verified {
    background: #ecfdf3;
    color: #087443
}

.category-provider-badges .featured {
    background: #fff7e8;
    color: #a15c00
}

.category-provider-body {
    padding: 12px 16px 15px;
    flex: 1
}

.category-provider-body h3 {
    margin: 0 0 6px;
    color: #172033;
    font-size: 1rem
}

.provider-location {
    margin: 0 0 11px;
    color: #667085;
    font-size: .78rem
}

.provider-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 7px 13px;
    color: #667085;
    font-size: .72rem
}

.provider-meta i {
    color: #1265d6
}

.category-provider-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    padding: 12px 16px 16px;
    border-top: 1px solid #eef1f5
}

.view-provider-btn,.quote-provider-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 37px;
    border-radius: 8px;
    text-decoration: none;
    font-size: .74rem;
    font-weight: 750
}

.view-provider-btn {
    border: 1px solid #d8e0eb;
    color: #344054;
    background: #fff
}

.quote-provider-btn {
    border: 1px solid #1265d6;
    color: #fff;
    background: #1265d6
}

.view-provider-btn:hover {
    background: #f7f9fc
}

.quote-provider-btn:hover {
    filter: brightness(.96)
}

.category-empty {
    text-align: center;
    padding: 42px 22px
}

.category-empty-icon {
    width: 62px;
    height: 62px;
    margin: 0 auto 14px;
    border-radius: 16px;
    display: grid;
    place-items: center;
    background: #eef5ff;
    color: #1265d6;
    font-size: 1.65rem
}

.category-empty h3 {
    margin: 0 0 7px;
    color: #172033
}

.category-empty p {
    max-width: 590px;
    margin: 0 auto 18px;
    color: #667085;
    line-height: 1.6;
    font-size: .82rem
}

.category-empty .submit-btn {
    display: inline-flex;
    text-decoration: none
}

.category-side-copy {
    font-size: .78rem;
    line-height: 1.55;
    color: #667085;
    margin: 0 0 12px
}

@media(max-width: 980px) {
    .category-content {
        grid-template-columns:1fr
    }

    .category-content .provider-side {
        display: grid;
        grid-template-columns: repeat(3,1fr)
    }
}

@media(max-width: 760px) {
    .category-hero-card {
        align-items:flex-start;
        flex-direction: column
    }

    .category-provider-grid {
        grid-template-columns: 1fr
    }

    .category-content .provider-side {
        grid-template-columns: 1fr
    }

    .category-request-btn {
        width: 100%;
        justify-content: center
    }
}

@media(max-width: 480px) {
    .category-hero-card {
        padding:18px
    }

    .category-provider-actions {
        grid-template-columns: 1fr
    }

    .category-trust {
        flex-direction: column;
        gap: 7px
    }
}

/* Service Category Marketplace */
.scm-page {
    background: #f7f9fc;
    color: #172033;
    padding: 22px 0 64px
}

.scm-shell {
    width: min(1180px,calc(100% - 32px));
    margin: auto
}

.scm-crumb {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 15px;
    color: #8490a3;
    font-size: .8rem
}

.scm-crumb a {
    color: #56647a;
    text-decoration: none
}

.scm-crumb>i {
    font-size: .6rem
}

.scm-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    padding: 32px 36px;
    border-radius: 23px;
    background: linear-gradient(125deg,#102d67,#1850b1 62%,#625fdc);
    color: #fff;
    box-shadow: 0 16px 40px rgba(28,66,145,.16)
}

.scm-hero>div>small {
    color: #cfe0ff;
    font-size: .68rem;
    font-weight: 850;
    letter-spacing: .1em
}

.scm-title {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-top: 11px
}

.scm-title>i {
    width: 60px;
    height: 60px;
    display: grid;
    place-items: center;
    flex: 0 0 60px;
    border: 1px solid rgba(255,255,255,.2);
    border-radius: 17px;
    background: rgba(255,255,255,.13);
    font-size: 25px
}

.scm-title h1 {
    margin: 0 0 6px;
    font-size: clamp(1.8rem,3vw,2.55rem);
    font-weight: 800
}

.scm-title p {
    max-width: 640px;
    margin: 0;
    color: rgba(255,255,255,.78);
    line-height: 1.6
}

.scm-trust {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    margin-top: 20px
}

.scm-trust span {
    font-size: .77rem;
    font-weight: 650;
    color: rgba(255,255,255,.88)
}

.scm-trust i {
    color: #8ff0bd;
    margin-right: 5px
}

.scm-hero-side {
    min-width: 215px;
    display: grid;
    gap: 10px
}

.scm-hero-side>span {
    padding: 11px 14px;
    border: 1px solid rgba(255,255,255,.17);
    border-radius: 12px;
    background: rgba(255,255,255,.1);
    font-size: .78rem
}

.scm-hero-side b {
    font-size: 1.2rem
}

.scm-hero-side>a,.scm-primary {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 10px 15px;
    border-radius: 11px;
    background: #fff;
    color: #16489e;
    text-decoration: none;
    font-size: .8rem;
    font-weight: 800
}

.scm-toolbar {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin: 31px 0 17px
}

.scm-toolbar small,.scm-how>small,.scm-join>small {
    color: #2563eb;
    font-size: .66rem;
    font-weight: 850;
    letter-spacing: .1em
}

.scm-toolbar h2,.scm-how h2 {
    margin: 3px 0 0;
    color: #17233d;
    font-size: 1.38rem;
    font-weight: 800
}

.scm-toolbar p {
    margin: 4px 0 0;
    color: #7b8799;
    font-size: .82rem
}

.scm-filters {
    display: flex;
    gap: 6px
}

.scm-filters label {
    height: 39px;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 0 10px;
    border: 1px solid #dfe5ee;
    border-radius: 10px;
    background: #fff;
    color: #8c98aa
}

.scm-filters input {
    width: 160px;
    border: 0;
    outline: 0;
    font-size: .78rem
}

.scm-filters button {
    height: 39px;
    padding: 0 11px;
    border: 1px solid #dfe5ee;
    border-radius: 10px;
    background: #fff;
    color: #5c687b;
    font-size: .74rem;
    font-weight: 750
}

.scm-filters button.active,.scm-filters button:hover {
    border-color: #bfd2fb;
    background: #edf4ff;
    color: #1e5ecb
}

.scm-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 15px
}

.scm-card {
    padding: 19px;
    border: 1px solid #e0e7f0;
    border-radius: 17px;
    background: #fff;
    box-shadow: 0 5px 18px rgba(30,47,75,.04);
    transition: .2s
}

.scm-card:hover {
    transform: translateY(-2px);
    border-color: #cbd9ed;
    box-shadow: 0 12px 28px rgba(30,47,75,.08)
}

.scm-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.scm-avatar {
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    border-radius: 14px;
    background: #edf3ff;
    color: #2863c8;
    font-size: 21px
}

.scm-card-top>div {
    display: flex;
    gap: 5px
}

.scm-card-top>div span {
    padding: 4px 7px;
    border-radius: 20px;
    font-size: .62rem;
    font-weight: 800
}

.scm-card-top .verified {
    background: #eaf9f0;
    color: #147747
}

.scm-card-top .featured {
    background: #fff4dc;
    color: #a56608
}

.scm-card h3 {
    margin: 14px 0 4px;
    color: #17233d;
    font-size: 1.03rem;
    font-weight: 800
}

.scm-location {
    margin: 0;
    color: #748095;
    font-size: .74rem
}

.scm-facts {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 6px;
    margin-top: 14px
}

.scm-facts>span {
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 6px;
    padding: 8px;
    border-radius: 9px;
    background: #f7f9fc
}

.scm-facts i {
    grid-row: 1/3;
    color: #426fc1;
    font-size: .75rem
}

.scm-facts b {
    font-size: .7rem;
    color: #2c3951
}

.scm-facts small {
    font-size: .58rem;
    color: #7c8798
}

.scm-actions {
    display: grid;
    grid-template-columns: 1fr 1.15fr;
    gap: 8px;
    margin-top: 16px;
    padding-top: 14px;
    border-top: 1px solid #edf0f5
}

.scm-actions a {
    min-height: 41px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-radius: 10px;
    text-decoration: none;
    font-size: .76rem;
    font-weight: 800
}

.scm-actions .profile {
    border: 1px solid #d7e0eb;
    color: #40516b
}

.scm-actions .quote {
    background: #2464d5;
    color: #fff
}

.scm-empty,.scm-filter-empty {
    text-align: center;
    border: 1px dashed #ccd8e8;
    border-radius: 19px;
    background: #fff
}

.scm-empty {
    padding: 50px 22px
}

.scm-empty>i {
    width: 72px;
    height: 72px;
    display: grid;
    place-items: center;
    margin: 0 auto 15px;
    border-radius: 20px;
    background: #edf4ff;
    color: #2865ce;
    font-size: 28px
}

.scm-empty>small {
    color: #2563eb;
    font-size: .65rem;
    font-weight: 850;
    letter-spacing: .1em
}

.scm-empty h2 {
    margin: 7px 0;
    color: #17233d
}

.scm-empty p {
    max-width: 580px;
    margin: auto;
    color: #748095
}

.scm-empty>div {
    display: flex;
    justify-content: center;
    gap: 9px;
    margin-top: 20px
}

.scm-empty .scm-primary {
    background: #2464d5;
    color: #fff
}

.scm-secondary {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 15px;
    border: 1px solid #dbe3ee;
    border-radius: 11px;
    color: #40516b;
    text-decoration: none;
    font-size: .8rem;
    font-weight: 800
}

.scm-filter-empty {
    padding: 38px
}

.scm-filter-empty h3 {
    margin: 7px 0 2px
}

.scm-filter-empty p {
    margin: 0;
    color: #748095
}

.scm-bottom {
    display: grid;
    grid-template-columns: 1.65fr .75fr;
    gap: 15px;
    margin-top: 26px
}

.scm-how,.scm-join {
    padding: 21px;
    border: 1px solid #e0e7f0;
    border-radius: 17px;
    background: #fff
}

.scm-how>div {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 9px;
    margin-top: 15px
}

.scm-how>div span {
    display: grid;
    gap: 4px;
    padding: 13px;
    border-radius: 11px;
    background: #f7f9fc
}

.scm-how i {
    color: #2865cc
}

.scm-how b {
    font-size: .75rem
}

.scm-how em {
    color: #7c8798;
    font-size: .65rem;
    font-style: normal
}

.scm-join {
    background: linear-gradient(145deg,#f7faff,#f7f4ff)
}

.scm-join>i {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    margin-bottom: 11px;
    border-radius: 11px;
    background: #e5edff;
    color: #315fc4
}

.scm-join h3 {
    margin: 3px 0 6px;
    font-size: .98rem
}

.scm-join p {
    margin: 0;
    color: #748095;
    font-size: .73rem
}

.scm-join a {
    display: inline-flex;
    gap: 5px;
    margin-top: 14px;
    color: #245fc9;
    text-decoration: none;
    font-size: .76rem;
    font-weight: 800
}

@media(max-width: 992px) {
    .scm-grid {
        grid-template-columns:1fr
    }

    .scm-toolbar {
        align-items: flex-start;
        flex-direction: column
    }

    .scm-bottom {
        grid-template-columns: 1fr
    }
}

@media(max-width: 768px) {
    .scm-shell {
        width:calc(100% - 22px)
    }

    .scm-hero {
        padding: 25px 21px;
        flex-direction: column;
        align-items: stretch
    }

    .scm-hero-side {
        min-width: 0;
        grid-template-columns: 1fr 1.3fr
    }

    .scm-filters {
        width: 100%;
        flex-wrap: wrap
    }

    .scm-filters label {
        width: 100%
    }

    .scm-filters input {
        width: 100%
    }

    .scm-filters button {
        flex: 1
    }

    .scm-how>div {
        grid-template-columns: 1fr
    }

    .scm-empty>div {
        flex-direction: column
    }
}

@media(max-width: 520px) {
    .scm-title {
        display:block
    }

    .scm-title>i {
        margin-bottom: 12px
    }

    .scm-hero-side {
        grid-template-columns: 1fr
    }

    .scm-actions {
        grid-template-columns: 1fr
    }

    .scm-facts {
        gap: 4px
    }
}

/* Provider Directory + Public Profile — clean marketplace UI */
.hoi-provider-directory,.hoi-provider-profile {
    background: #f7f9fc!important;
    padding: 22px 0 64px!important;
    font-family: "Source Sans Pro",system-ui,-apple-system,sans-serif
}

.hoi-provider-directory .provider-shell,.hoi-provider-profile .provider-shell {
    max-width: 1180px;
    margin: auto
}

.hoi-provider-breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 15px;
    color: #8a94a6;
    font-size: .78rem;
    font-weight: 600
}

.hoi-provider-breadcrumb a {
    color: #536176;
    text-decoration: none
}

.hoi-provider-breadcrumb a:hover {
    color: #1265d6
}

.hoi-provider-breadcrumb>i {
    font-size: .55rem;
    color: #b4bdca
}

.hoi-provider-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 35px;
    padding: 34px 38px;
    border: 1px solid #dfe7f2;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 10px 34px rgba(18,38,63,.055)
}

.hoi-provider-kicker {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 10px;
    color: #1265d6;
    font-size: .68rem;
    font-weight: 850;
    letter-spacing: .09em
}

.hoi-provider-hero h1 {
    max-width: 650px;
    margin: 0 0 8px;
    color: #17233d;
    font-size: clamp(1.8rem,3vw,2.55rem);
    line-height: 1.08;
    font-weight: 850;
    letter-spacing: -.035em
}

.hoi-provider-hero p {
    max-width: 680px;
    margin: 0;
    color: #6d788b;
    font-size: .92rem;
    line-height: 1.65
}

.hoi-provider-trust {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    margin-top: 20px;
    color: #4f5e74;
    font-size: .75rem;
    font-weight: 700
}

.hoi-provider-trust i {
    margin-right: 4px;
    color: #0f8a5f
}

.hoi-provider-hero-actions {
    min-width: 215px;
    display: grid;
    gap: 9px
}

.hoi-provider-primary,.hoi-provider-secondary,.hoi-provider-outline {
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 10px 15px;
    border-radius: 9px;
    text-decoration: none;
    font-size: .78rem;
    font-weight: 800
}

.hoi-provider-primary {
    border: 1px solid #1265d6;
    background: #1265d6;
    color: #fff;
    box-shadow: 0 7px 16px rgba(18,101,214,.15)
}

.hoi-provider-secondary,.hoi-provider-outline {
    border: 1px solid #d7e0ec;
    background: #fff;
    color: #344054
}

.hoi-provider-listing-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin: 31px 0 16px
}

.hoi-provider-listing-head span {
    color: #1265d6;
    font-size: .66rem;
    font-weight: 850;
    letter-spacing: .09em
}

.hoi-provider-listing-head h2 {
    margin: 3px 0;
    color: #17233d;
    font-size: 1.4rem;
    font-weight: 850
}

.hoi-provider-listing-head p {
    margin: 3px 0 0;
    color: #7a8597;
    font-size: .8rem
}

.hoi-provider-listing-head>a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #526079;
    text-decoration: none;
    font-size: .75rem;
    font-weight: 750
}

.hoi-provider-grid {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 14px
}

.hoi-provider-card {
    display: flex;
    flex-direction: column;
    padding: 18px;
    border: 1px solid #e1e7f0;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 4px 16px rgba(24,39,65,.035);
    transition: .18s
}

.hoi-provider-card:hover {
    transform: translateY(-2px);
    border-color: #c6d5eb;
    box-shadow: 0 10px 25px rgba(24,39,65,.07)
}

.hoi-provider-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.hoi-provider-avatar {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    background: #edf4ff;
    color: #1265d6;
    font-size: 19px
}

.hoi-verified {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 5px 8px;
    border-radius: 999px;
    background: #ecfdf3;
    color: #087443;
    font-size: .64rem;
    font-weight: 800
}

.hoi-provider-card-copy {
    padding: 14px 0 17px;
    flex: 1
}

.hoi-provider-card-copy h3 {
    margin: 0 0 5px;
    color: #1b2841;
    font-size: 1rem;
    font-weight: 800
}

.hoi-provider-card-copy p {
    margin: 0;
    color: #788498;
    font-size: .73rem
}

.hoi-provider-experience {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-top: 12px;
    color: #5d697c;
    font-size: .7rem;
    font-weight: 650
}

.hoi-provider-view {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 13px;
    border-top: 1px solid #edf0f5;
    color: #1265d6;
    text-decoration: none;
    font-size: .74rem;
    font-weight: 800
}

.hoi-provider-empty {
    text-align: center;
    padding: 55px 24px;
    border: 1px dashed #cbd7e7;
    border-radius: 16px;
    background: #fff
}

.hoi-provider-empty>span {
    width: 66px;
    height: 66px;
    display: grid;
    place-items: center;
    margin: 0 auto 14px;
    border-radius: 17px;
    background: #edf4ff;
    color: #1265d6;
    font-size: 26px
}

.hoi-provider-empty h2 {
    margin: 0 0 6px
}

.hoi-provider-empty p {
    max-width: 570px;
    margin: auto;
    color: #758095
}

.hoi-provider-empty>div {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-top: 18px
}

.hoi-profile-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    padding: 27px 30px;
    border: 1px solid #e0e7f0;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 7px 26px rgba(24,39,65,.045)
}

.hoi-profile-identity {
    display: flex;
    align-items: center;
    gap: 17px
}

.hoi-profile-avatar {
    width: 68px;
    height: 68px;
    display: grid;
    place-items: center;
    flex: 0 0 68px;
    border-radius: 17px;
    background: linear-gradient(145deg,#eaf2ff,#f3efff);
    color: #245fc5;
    font-size: 27px
}

.hoi-profile-badges {
    display: flex;
    gap: 5px;
    margin-bottom: 7px
}

.hoi-profile-badges span {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 7px;
    border-radius: 999px;
    font-size: .62rem;
    font-weight: 800
}

.hoi-profile-badges .verified {
    background: #eaf9f0;
    color: #087443
}

.hoi-profile-badges .approved {
    background: #edf4ff;
    color: #245ebd
}

.hoi-profile-identity h1 {
    margin: 0 0 5px;
    color: #17233d;
    font-size: clamp(1.5rem,2.5vw,2rem);
    font-weight: 850
}

.hoi-profile-identity p {
    margin: 0;
    color: #758095;
    font-size: .78rem
}

.hoi-profile-hero-action {
    text-align: right
}

.hoi-profile-hero-action>span {
    display: block;
    margin-bottom: 7px;
    color: #7b8798;
    font-size: .7rem
}

.hoi-profile-hero-action>a {
    display: inline-flex;
    gap: 7px;
    padding: 11px 16px;
    border-radius: 9px;
    background: #1265d6;
    color: #fff;
    text-decoration: none;
    font-size: .77rem;
    font-weight: 800
}

.hoi-profile-layout {
    display: grid;
    grid-template-columns: minmax(0,1fr) 310px;
    gap: 17px;
    margin-top: 17px;
    align-items: start
}

.hoi-profile-main,.hoi-profile-side {
    display: grid;
    gap: 14px
}

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

.hoi-profile-stats>div {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 15px;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #fff
}

.hoi-profile-stats>div>i {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: #edf4ff;
    color: #1265d6
}

.hoi-profile-stats span {
    display: grid;
    color: #7a8597;
    font-size: .64rem
}

.hoi-profile-stats strong {
    color: #25324a;
    font-size: .85rem
}

.hoi-profile-section {
    padding: 22px;
    border: 1px solid #e1e7f0;
    border-radius: 14px;
    background: #fff
}

.hoi-profile-section-title {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 14px
}

.hoi-profile-section-title>span {
    width: 39px;
    height: 39px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: #f0f5ff;
    color: #1265d6
}

.hoi-profile-section-title small {
    color: #1265d6;
    font-size: .61rem;
    font-weight: 850
}

.hoi-profile-section-title h2 {
    margin: 2px 0 0;
    font-size: 1rem
}

.hoi-profile-section>p {
    margin: 0;
    color: #66758a;
    font-size: .82rem;
    line-height: 1.72
}

.hoi-service-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 7px
}

.hoi-service-chips span {
    padding: 7px 10px;
    border: 1px solid #dbe5f4;
    border-radius: 8px;
    background: #f7faff;
    color: #355174;
    font-size: .72rem;
    font-weight: 700
}

.hoi-service-chips i {
    color: #0f8a5f
}

.hoi-quote-card,.hoi-profile-side-card {
    padding: 19px;
    border: 1px solid #e1e7f0;
    border-radius: 14px;
    background: #fff
}

.hoi-quote-card {
    background: linear-gradient(145deg,#15386f,#1265d6);
    color: #fff;
    border: 0
}

.hoi-quote-icon {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    margin-bottom: 14px;
    border-radius: 11px;
    background: rgba(255,255,255,.14)
}

.hoi-quote-card>small {
    color: #d7e7ff;
    font-size: .62rem;
    font-weight: 850
}

.hoi-quote-card h2 {
    margin: 4px 0 7px;
    font-size: 1.08rem
}

.hoi-quote-card p {
    margin: 0;
    color: rgba(255,255,255,.78);
    font-size: .75rem
}

.hoi-quote-card>a {
    display: flex;
    justify-content: center;
    gap: 6px;
    margin-top: 16px;
    padding: 10px;
    border-radius: 8px;
    background: #fff;
    color: #174d9c;
    text-decoration: none;
    font-size: .75rem;
    font-weight: 800
}

.hoi-profile-side-card h3 {
    margin: 0 0 7px;
    font-size: .85rem
}

.hoi-profile-side-card p {
    margin: 0;
    color: #758095;
    font-size: .72rem
}

.hoi-profile-side-card>a {
    display: inline-flex;
    margin-top: 11px;
    color: #1265d6;
    text-decoration: none;
    font-size: .72rem;
    font-weight: 800
}

@media(max-width: 950px) {
    .hoi-provider-grid {
        grid-template-columns:repeat(2,1fr)
    }

    .hoi-profile-layout {
        grid-template-columns: 1fr
    }

    .hoi-profile-side {
        grid-template-columns: repeat(3,1fr)
    }

    .hoi-provider-hero {
        align-items: flex-start;
        flex-direction: column
    }

    .hoi-provider-hero-actions {
        width: 100%;
        grid-template-columns: 1fr 1fr
    }
}

@media(max-width: 700px) {
    .hoi-provider-directory,.hoi-provider-profile {
        padding:13px 10px 40px!important
    }

    .hoi-provider-hero {
        padding: 24px 20px
    }

    .hoi-provider-listing-head {
        align-items: flex-start;
        flex-direction: column
    }

    .hoi-provider-grid {
        grid-template-columns: 1fr
    }

    .hoi-profile-hero {
        align-items: flex-start;
        flex-direction: column;
        padding: 20px
    }

    .hoi-profile-hero-action {
        width: 100%;
        text-align: left
    }

    .hoi-profile-hero-action>a {
        width: 100%;
        justify-content: center
    }

    .hoi-profile-stats,.hoi-profile-side {
        grid-template-columns: 1fr
    }
}

@media(max-width: 480px) {
    .hoi-provider-hero-actions {
        grid-template-columns:1fr
    }

    .hoi-profile-identity {
        align-items: flex-start
    }

    .hoi-profile-avatar {
        width: 56px;
        height: 56px;
        flex-basis: 56px
    }

    .hoi-provider-empty>div {
        flex-direction: column
    }
}

/* Provider Portal — Profile KYC Summary */
.pp-profile-kyc {
    display: grid;
    grid-template-columns: 54px minmax(0,1fr) auto;
    align-items: center;
    gap: 16px;
    margin-bottom: 15px;
    padding: 19px 21px;
    border: 1px solid #dfe7f1;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 5px 18px rgba(16,24,40,.035)
}

.pp-profile-kyc-icon {
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    border-radius: 13px;
    background: #edf4ff;
    color: #1265d6;
    font-size: 21px
}

.pp-profile-kyc-copy>small {
    color: #1265d6;
    font-size: .6rem;
    font-weight: 850;
    letter-spacing: .09em
}

.pp-profile-kyc-copy h2 {
    margin: 2px 0 4px;
    color: #172033;
    font-size: 1.02rem;
    font-weight: 850
}

.pp-profile-kyc-copy>p {
    margin: 0;
    color: #758095;
    font-size: .7rem
}

.pp-profile-kyc-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 7px 18px;
    margin-top: 10px
}

.pp-profile-kyc-meta span {
    color: #8a94a6;
    font-size: .63rem
}

.pp-profile-kyc-meta strong {
    margin-left: 4px;
    color: #475467
}

.pp-profile-kyc-action {
    display: grid;
    justify-items: end;
    gap: 7px
}

.pp-profile-kyc-action>span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 8px;
    border-radius: 999px;
    font-size: .64rem;
    font-weight: 800
}

.pp-kyc-verified {
    background: #ecfdf3;
    color: #087443
}

.pp-kyc-pending {
    background: #fff7e6;
    color: #a15c00
}

.pp-kyc-rejected {
    background: #fef3f2;
    color: #b42318
}

.pp-kyc-required {
    background: #eef4ff;
    color: #245ebd
}

.pp-profile-kyc-action>a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #1265d6;
    text-decoration: none;
    font-size: .7rem;
    font-weight: 800
}

.pp-profile-kyc-action>a.pp-kyc-primary {
    padding: 8px 11px;
    border-radius: 8px;
    background: #1265d6;
    color: #fff
}

@media(max-width: 700px) {
    .pp-profile-kyc {
        grid-template-columns:46px 1fr;
        padding: 16px
    }

    .pp-profile-kyc-icon {
        width: 44px;
        height: 44px
    }

    .pp-profile-kyc-action {
        grid-column: 1/-1;
        width: 100%;
        justify-items: stretch
    }

    .pp-profile-kyc-action>span,.pp-profile-kyc-action>a {
        justify-content: center
    }
}

/* Provider Portal — KYC Page */
/* Provider Portal — KYC Page */
.pp-kyc-hero {
    display: grid;
    grid-template-columns: 54px minmax(0,1fr) auto;
    align-items: center;
    gap: 16px;
    margin-bottom: 15px;
    padding: 20px 22px;
    border: 1px solid #dfe7f1;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 5px 18px rgba(16,24,40,.035)
}

.pp-kyc-hero-icon,.pp-kyc-section-title>span,.pp-kyc-side-icon {
    display: grid;
    place-items: center;
    background: #edf4ff;
    color: #1265d6
}

.pp-kyc-hero-icon {
    width: 52px;
    height: 52px;
    border-radius: 13px;
    font-size: 21px
}

.pp-kyc-hero-copy small,.pp-kyc-section-title small {
    color: #1265d6;
    font-size: .6rem;
    font-weight: 850;
    letter-spacing: .09em
}

.pp-kyc-hero-copy h2 {
    margin: 2px 0 4px;
    color: #172033;
    font-size: 1.08rem
}

.pp-kyc-hero-copy p {
    margin: 0;
    color: #758095;
    font-size: .72rem
}

.pp-kyc-status {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 6px 9px;
    border-radius: 999px;
    font-size: .65rem;
    font-weight: 800
}

.pp-kyc-status.verified {
    background: #ecfdf3;
    color: #087443
}

.pp-kyc-status.pending {
    background: #fff7e6;
    color: #a15c00
}

.pp-kyc-status.rejected {
    background: #fef3f2;
    color: #b42318
}

.pp-kyc-status.required {
    background: #eef4ff;
    color: #245ebd
}

.pp-kyc-layout {
    display: grid;
    grid-template-columns: minmax(0,1fr) 285px;
    gap: 14px;
    align-items: start
}

.pp-kyc-main,.pp-kyc-side {
    display: grid;
    gap: 14px
}

.pp-kyc-layout .pp-card {
    margin: 0
}

.pp-kyc-section-title {
    display: flex;
    align-items: center;
    gap: 10px;
    padding-bottom: 14px;
    border-bottom: 1px solid #edf0f4
}

.pp-kyc-section-title>span {
    width: 38px;
    height: 38px;
    border-radius: 9px
}

.pp-kyc-section-title h3 {
    margin: 2px 0 0;
    font-size: .9rem;
    color: #25324a
}

.pp-kyc-info-grid {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 8px;
    margin-top: 14px
}

.pp-kyc-info-grid>div {
    display: grid;
    padding: 11px;
    border-radius: 9px;
    background: #f7f9fc
}

.pp-kyc-info-grid small {
    color: #8a94a6;
    font-size: .6rem
}

.pp-kyc-info-grid strong {
    margin-top: 2px;
    color: #344054;
    font-size: .72rem;
    overflow-wrap: anywhere
}

.pp-kyc-message {
    display: flex;
    gap: 11px;
    margin-top: 14px;
    padding: 13px;
    border-radius: 10px
}

.pp-kyc-message>i {
    font-size: 18px
}

.pp-kyc-message b {
    font-size: .75rem
}

.pp-kyc-message p {
    margin: 2px 0 0;
    font-size: .66rem;
    line-height: 1.45
}

.pp-kyc-message.verified {
    background: #ecfdf3;
    color: #087443
}

.pp-kyc-message.pending {
    background: #fff8e8;
    color: #975b08
}

.pp-kyc-message.rejected {
    background: #fef3f2;
    color: #b42318
}

.pp-kyc-message.required {
    background: #eef4ff;
    color: #245ebd
}

.pp-kyc-requirements {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 8px;
    margin-top: 14px
}

.pp-kyc-requirements>div {
    display: flex;
    gap: 8px;
    padding: 11px;
    border: 1px solid #e4e9f1;
    border-radius: 9px
}

.pp-kyc-requirements i {
    color: #1265d6
}

.pp-kyc-requirements span {
    display: grid
}

.pp-kyc-requirements b {
    font-size: .69rem
}

.pp-kyc-requirements small {
    margin-top: 2px;
    color: #8490a2;
    font-size: .58rem;
    line-height: 1.35
}

.pp-kyc-submit-note {
    display: flex;
    gap: 10px;
    margin-top: 14px;
    padding: 12px;
    border: 1px dashed #cad6e5;
    border-radius: 9px;
    background: #fafcff;
    color: #526079
}

.pp-kyc-submit-note>i {
    color: #1265d6
}

.pp-kyc-submit-note b {
    font-size: .7rem
}

.pp-kyc-submit-note p {
    margin: 2px 0 0;
    color: #7c8798;
    font-size: .62rem;
    line-height: 1.45
}

.pp-kyc-side .pp-card {
    padding: 17px
}

.pp-kyc-side-icon {
    width: 39px;
    height: 39px;
    margin-bottom: 10px;
    border-radius: 10px
}

.pp-kyc-side h3 {
    margin: 0 0 5px;
    color: #25324a;
    font-size: .82rem
}

.pp-kyc-side p {
    margin: 0;
    color: #7b8798;
    font-size: .66rem;
    line-height: 1.5
}

.pp-kyc-help a {
    display: flex;
    justify-content: center;
    gap: 5px;
    margin-top: 12px;
    padding: 8px;
    border-radius: 8px;
    background: #1265d6;
    color: #fff;
    text-decoration: none;
    font-size: .67rem;
    font-weight: 800
}

@media(max-width: 850px) {
    .pp-kyc-layout {
        grid-template-columns:1fr
    }

    .pp-kyc-side {
        grid-template-columns: 1fr 1fr
    }
}

@media(max-width: 650px) {
    .pp-kyc-hero {
        grid-template-columns:44px 1fr;
        padding: 16px
    }

    .pp-kyc-hero-icon {
        width: 42px;
        height: 42px
    }

    .pp-kyc-status {
        grid-column: 1/-1;
        justify-content: center
    }

    .pp-kyc-info-grid,.pp-kyc-requirements,.pp-kyc-side {
        grid-template-columns: 1fr
    }
}

/* Provider KYC submission + admin review */
.pp-kyc-form {
    margin-top: 16px
}

.pp-kyc-form-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 14px
}

.pp-kyc-form-grid label {
    display: grid;
    gap: 6px;
    color: #344054;
    font-size: .75rem;
    font-weight: 750
}

.pp-kyc-form-grid .full {
    grid-column: 1/-1
}

.pp-kyc-form-grid input,.pp-kyc-form-grid select {
    width: 100%;
    min-height: 43px;
    border: 1px solid #d7deea;
    border-radius: 8px;
    background: #fff;
    padding: 9px 10px;
    outline: 0
}

.pp-kyc-form-grid input:focus,.pp-kyc-form-grid select:focus {
    border-color: #1265d6;
    box-shadow: 0 0 0 3px rgba(18,101,214,.08)
}

.pp-kyc-form-grid input[type=file] {
    padding: 7px
}

.pp-kyc-form-grid label>small {
    color: #8490a2;
    font-size: .61rem;
    font-weight: 500
}

.pp-kyc-consent {
    display: flex!important;
    grid-template-columns: 18px 1fr!important;
    align-items: flex-start!important;
    padding: 12px;
    border: 1px solid #dfe6ef;
    border-radius: 9px;
    background: #fafcff
}

.pp-kyc-consent input {
    width: 16px!important;
    height: 16px!important;
    min-height: 0!important;
    margin-top: 2px
}

.pp-kyc-consent span {
    font-size: .67rem;
    line-height: 1.5;
    font-weight: 600
}

.admin-kyc-review-link {
    display: inline-block;
    margin-top: 5px;
    color: #1265d6;
    text-decoration: none;
    font-size: .72rem;
    font-weight: 800
}

.admin-kyc-grid {
    display: grid;
    grid-template-columns: minmax(0,1fr) 310px;
    gap: 16px
}

.admin-kyc-grid h3 {
    margin-top: 0
}

.admin-kyc-info {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 9px;
    margin-top: 14px
}

.admin-kyc-info>div {
    display: grid;
    padding: 11px;
    border-radius: 9px;
    background: #f7f9fc
}

.admin-kyc-info small {
    color: #8490a2;
    font-size: .65rem
}

.admin-kyc-info b {
    margin-top: 3px;
    font-size: .78rem
}

.admin-kyc-docs {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 8px;
    margin-top: 15px
}

.admin-kyc-docs a {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 42px;
    border: 1px solid #dbe4f0;
    border-radius: 9px;
    color: #1265d6;
    text-decoration: none;
    font-size: .72rem;
    font-weight: 800
}

.admin-kyc-action {
    display: grid;
    gap: 10px;
    margin-top: 14px
}

.admin-kyc-action textarea {
    width: 100%;
    border: 1px solid #d7deea;
    border-radius: 8px;
    padding: 10px;
    resize: vertical
}

.admin-verify {
    background: #087443!important;
    color: #fff!important
}

.admin-reject {
    background: #b42318!important;
    color: #fff!important
}

.admin-kyc-empty {
    padding: 20px;
    border: 1px dashed #ccd7e5;
    border-radius: 10px;
    color: #758095;
    text-align: center
}

@media(max-width: 850px) {
    .admin-kyc-grid {
        grid-template-columns:1fr
    }

    .admin-kyc-docs {
        grid-template-columns: 1fr 1fr
    }
}

@media(max-width: 650px) {
    .pp-kyc-form-grid,.admin-kyc-info,.admin-kyc-docs {
        grid-template-columns:1fr
    }

    .pp-kyc-form-grid .full {
        grid-column: 1
    }
}

/* =========================================================
   Provider Portal — Customer Requests + Quote Workflow
   ========================================================= */
.pp-request-page,.pp-quotes-page {
    overflow: visible
}

.pp-request-list,.pp-quote-list {
    display: grid;
    gap: 15px
}

.pp-request-item,.pp-my-quote {
    position: relative;
    padding: 18px;
    border: 1px solid #e1e7f0;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 4px 16px rgba(24,39,65,.035);
    transition: .18s ease
}

.pp-request-item:hover,.pp-my-quote:hover {
    border-color: #c8d6ea;
    box-shadow: 0 10px 25px rgba(24,39,65,.07)
}

.pp-request-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px
}

.pp-request-top h3 {
    margin: 4px 0 0;
    color: #17233d;
    font-size: 1rem;
    font-weight: 800
}

.pp-request-code {
    display: block;
    color: #1265d6;
    font-size: .65rem;
    font-weight: 850;
    letter-spacing: .07em;
    text-transform: uppercase
}

.pp-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    padding: 5px 9px;
    border-radius: 999px;
    background: #edf4ff;
    color: #245ebd;
    font-size: .65rem;
    font-weight: 800;
    text-transform: capitalize
}

.pp-request-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 15px;
    margin: 13px 0;
    color: #748095;
    font-size: .72rem
}

.pp-request-meta span {
    display: inline-flex;
    align-items: center;
    gap: 5px
}

.pp-request-meta i {
    color: #1265d6
}

.pp-requirement {
    padding: 12px 14px;
    border: 1px solid #edf0f5;
    border-radius: 10px;
    background: #f8fafc
}

.pp-requirement strong {
    display: block;
    color: #344054;
    font-size: .7rem;
    font-weight: 800
}

.pp-requirement p {
    margin: 4px 0 0;
    color: #667085;
    font-size: .75rem;
    line-height: 1.55
}

.pp-quote-box {
    margin-top: 14px;
    overflow: hidden;
    border: 1px solid #dce5f1;
    border-radius: 11px;
    background: #fbfdff
}

.pp-quote-box summary {
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 12px 14px;
    cursor: pointer;
    list-style: none;
    color: #1265d6;
    font-size: .74rem;
    font-weight: 800;
    user-select: none
}

.pp-quote-box summary::-webkit-details-marker {
    display: none
}

.pp-quote-box summary:after {
    content: "\F282";
    margin-left: auto;
    font-family: "bootstrap-icons";
    font-size: .72rem;
    transition: transform .18s ease
}

.pp-quote-box[open] summary:after {
    transform: rotate(180deg)
}

.pp-quote-box[open] summary {
    border-bottom: 1px solid #e7edf5;
    background: #f7faff
}

.pp-quote-form {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 12px;
    padding: 14px
}

.pp-quote-form label>span {
    display: block;
    margin-bottom: 6px;
    color: #344054;
    font-size: .7rem;
    font-weight: 750
}

.pp-quote-form input,.pp-quote-form textarea {
    width: 100%;
    border: 1px solid #d7deea;
    border-radius: 8px;
    background: #fff;
    color: #172033;
    padding: 10px 11px;
    outline: 0;
    font: inherit;
    font-size: .78rem
}

.pp-quote-form input {
    min-height: 42px
}

.pp-quote-form textarea {
    min-height: 92px;
    resize: vertical
}

.pp-quote-form input:focus,.pp-quote-form textarea:focus {
    border-color: #1265d6;
    box-shadow: 0 0 0 3px rgba(18,101,214,.08)
}

.pp-quote-form .full {
    grid-column: 1/-1
}

.pp-quote-actions {
    display: flex;
    justify-content: flex-end
}

.pp-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 40px;
    padding: 9px 15px;
    border: 1px solid #1265d6;
    border-radius: 8px;
    background: #1265d6;
    color: #fff!important;
    text-decoration: none;
    font-size: .74rem;
    font-weight: 800;
    cursor: pointer
}

.pp-btn:hover {
    background: #0f56b8;
    border-color: #0f56b8
}

.pp-quote-sent {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 14px;
    padding: 11px 13px;
    border: 1px solid #abefc6;
    border-radius: 10px;
    background: #ecfdf3;
    color: #087443
}

.pp-quote-sent>div {
    display: flex;
    align-items: center;
    gap: 9px
}

.pp-quote-sent span {
    display: grid
}

.pp-quote-sent strong {
    font-size: .73rem
}

.pp-quote-sent small {
    color: #26835b;
    font-size: .63rem
}

.pp-quote-sent>a {
    white-space: nowrap;
    color: #087443;
    text-decoration: none;
    font-size: .68rem;
    font-weight: 800
}

.pp-quote-summary {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 9px;
    margin: 14px 0
}

.pp-quote-summary>div {
    padding: 11px 12px;
    border: 1px solid #e4e9f1;
    border-radius: 9px;
    background: #f8fafc
}

.pp-quote-summary small {
    display: block;
    color: #8490a2;
    font-size: .59rem;
    font-weight: 800;
    text-transform: uppercase
}

.pp-quote-summary strong {
    display: block;
    margin-top: 3px;
    color: #25324a;
    font-size: .9rem;
    font-weight: 800
}

.pp-quote-note {
    margin: 8px 0;
    padding: 9px 11px;
    border-radius: 8px;
    background: #f8fafc;
    color: #667085;
    font-size: .7rem;
    line-height: 1.5
}

.pp-quote-note strong {
    color: #344054
}

.pp-withdraw-form {
    margin-top: 10px;
    text-align: right
}

.pp-link-danger {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #b42318;
    font-size: .68rem;
    font-weight: 800;
    cursor: pointer
}

.pp-muted-note {
    margin-top: 13px;
    padding: 10px 12px;
    border-radius: 8px;
    background: #f8fafc;
    color: #8490a2;
    font-size: .69rem
}

.pp-request-page .pp-alert,.pp-quotes-page .pp-alert {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 14px;
    padding: 11px 13px;
    border-radius: 9px;
    font-size: .74rem
}

.pp-request-page .pp-alert.success,.pp-quotes-page .pp-alert.success {
    border: 1px solid #abefc6;
    background: #ecfdf3;
    color: #087443
}

.pp-request-page .pp-alert.error,.pp-quotes-page .pp-alert.error {
    border: 1px solid #fecdca;
    background: #fef3f2;
    color: #b42318
}

.pp-request-page .pp-empty,.pp-quotes-page .pp-empty {
    text-align: center;
    padding: 45px 20px;
    color: #758095
}

.pp-request-page .pp-empty>i,.pp-quotes-page .pp-empty>i {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    margin: 0 auto 13px;
    border-radius: 15px;
    background: #edf4ff;
    color: #1265d6;
    font-size: 23px
}

.pp-request-page .pp-empty h3,.pp-quotes-page .pp-empty h3 {
    margin: 0 0 5px;
    color: #25324a;
    font-size: 1rem
}

.pp-request-page .pp-empty p,.pp-quotes-page .pp-empty p {
    margin: 0 auto 15px;
    max-width: 520px;
    font-size: .73rem;
    line-height: 1.5
}

@media(max-width: 700px) {
    .pp-request-item,.pp-my-quote {
        padding:15px
    }

    .pp-request-top,.pp-quote-sent {
        align-items: flex-start;
        flex-direction: column
    }

    .pp-request-meta {
        flex-direction: column;
        gap: 7px
    }

    .pp-quote-form,.pp-quote-summary {
        grid-template-columns: 1fr
    }

    .pp-quote-form .full {
        grid-column: auto
    }

    .pp-quote-actions .pp-btn {
        width: 100%
    }

    .pp-quote-sent>a {
        width: 100%;
        padding-top: 7px;
        border-top: 1px solid #ccebd9
    }

    .pp-withdraw-form {
        text-align: left
    }
}

/* =========================================================
   HomeofIndia Services — Admin Workspace
   Dashboard is the visual master for all Services admin pages
   ========================================================= */
.sa-admin {
    background: #f6f8fc;
    min-height: 75vh
}

.sa-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 18px;
    padding: 27px 30px;
    border-radius: 18px;
    background: #fff;
    color: #fff;
    box-shadow: 0 14px 34px rgba(28,66,145,.16)
}

.sa-hero-content {
    display: flex;
    align-items: center;
    gap: 16px;
    min-width: 0
}

.sa-hero-icon {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    flex: 0 0 58px;
    border: 1px solid #ccc;
    border-radius: 15px;
    background: #16489e;
    font-size: 24px
}

.sa-eyebrow {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-bottom: 4px;
    color: #16489e;
    font-size: .64rem;
    font-weight: 850;
    letter-spacing: .08em;
    text-transform: uppercase
}

.sa-hero h1 {
    margin: 0 0 5px;
    font-size: 1.65rem;
    font-weight: 850;
    letter-spacing: -.02em
}

.sa-hero p {
    max-width: 700px;
    margin: 0;
    color: #000;
    font-size: .8rem;
    line-height: 1.5
}

.sa-hero-actions {
    display: flex;
    align-items: center;
    gap: 9px;
    flex: 0 0 auto
}

.sa-count {
    min-width: 110px;
    padding: 9px 13px;
    border: 1px solid #ccc;
    border-radius: 10px;
    background: rgba(255,255,255,.1);
    text-align: center;
    color: #000;
}

.sa-count strong,.sa-count span {
    display: block
}

.sa-count strong {
    font-size: 1.12rem
}

.sa-count span {
    margin-top: 1px;
    color: #000;
    font-size: .6rem
}

.sa-dashboard-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 40px;
    padding: 9px 13px;
    border-radius: 9px;
    background: #16489e;
    color: #fff;
    text-decoration: none;
    font-size: .72rem;
    font-weight: 800
}

.sa-stats {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 11px;
    margin-bottom: 16px
}

.sa-stats>a {
    position: relative;
    padding: 17px;
    border: 1px solid #e1e7f0;
    border-radius: 13px;
    background: #fff;
    color: #25324a;
    text-decoration: none;
    box-shadow: 0 4px 14px rgba(24,39,65,.035)
}

.sa-stats>a>i {
    position: absolute;
    right: 15px;
    top: 15px;
    color: #1265d6;
    font-size: 18px
}

.sa-stats span,.sa-stats strong,.sa-stats small {
    display: block
}

.sa-stats span {
    color: #748095;
    font-size: .66rem;
    font-weight: 750
}

.sa-stats strong {
    margin: 5px 0 2px;
    font-size: 1.5rem
}

.sa-stats small {
    color: #98a2b3;
    font-size: .59rem
}

.sa-dashboard-grid {
    display: grid;
    grid-template-columns: minmax(0,1fr) 290px;
    gap: 14px
}

.sa-panel {
    padding: 19px;
    border: 1px solid #e1e7f0;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 4px 16px rgba(24,39,65,.035)
}

.sa-panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px
}

.sa-panel-head small {
    color: #1265d6;
    font-size: .6rem;
    font-weight: 850;
    letter-spacing: .08em
}

.sa-panel-head h2 {
    margin: 2px 0 0;
    color: #25324a;
    font-size: .95rem
}

.sa-panel-head>a {
    color: #1265d6;
    text-decoration: none;
    font-size: .68rem;
    font-weight: 800
}

.sa-menu-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px
}

.sa-menu-grid>a {
    display: grid;
    grid-template-columns: 38px 1fr auto;
    align-items: center;
    gap: 10px;
    padding: 12px;
    border: 1px solid #e7ebf1;
    border-radius: 10px;
    color: #344054;
    text-decoration: none
}

.sa-menu-grid>a>i:first-child {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    border-radius: 9px;
    background: #edf4ff;
    color: #1265d6
}

.sa-menu-grid b,.sa-menu-grid span {
    display: block
}

.sa-menu-grid b {
    font-size: .72rem
}

.sa-menu-grid span {
    margin-top: 2px;
    color: #8490a2;
    font-size: .59rem
}

.sa-menu-grid>a>i:last-child {
    color: #aab3c1;
    font-size: .7rem
}

.sa-attention {
    display: grid;
    gap: 7px
}

.sa-attention>a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 11px;
    border-radius: 9px;
    background: #f8fafc;
    color: #526079;
    text-decoration: none;
    font-size: .68rem
}

.sa-attention b {
    color: #17233d;
    font-size: .86rem
}

.sa-mini-stats {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 10px;
    margin-bottom: 14px
}

.sa-mini-stats>div {
    padding: 13px 15px;
    border: 1px solid #e3e8ef;
    border-radius: 11px;
    background: #fff
}

.sa-mini-stats span,.sa-mini-stats b {
    display: block
}

.sa-mini-stats span {
    color: #7b8798;
    font-size: .63rem;
    font-weight: 700
}

.sa-mini-stats b {
    margin-top: 3px;
    color: #25324a;
    font-size: 1.18rem
}

.sa-table-wrap {
    overflow: auto
}

.sa-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0
}

.sa-table th {
    padding: 10px 11px;
    border-bottom: 1px solid #e7ebf1;
    background: #f8fafc;
    color: #667085;
    text-align: left;
    white-space: nowrap;
    font-size: .61rem;
    font-weight: 850;
    letter-spacing: .04em;
    text-transform: uppercase
}

.sa-table td {
    padding: 11px;
    border-bottom: 1px solid #edf0f4;
    color: #475467;
    vertical-align: middle;
    font-size: .69rem
}

.sa-table tbody tr:hover {
    background: #fbfcfe
}

.sa-table td>strong,.sa-table td>small {
    display: block
}

.sa-table td>strong {
    color: #25324a;
    font-size: .72rem
}

.sa-table td>small {
    margin-top: 2px;
    color: #8a94a6;
    font-size: .59rem;
    line-height: 1.35
}

.sa-badge {
    display: inline-flex;
    padding: 4px 7px;
    border-radius: 999px;
    background: #f2f4f7;
    color: #475467;
    font-size: .59rem;
    font-weight: 800;
    text-transform: capitalize
}

.sa-badge.approved,.sa-badge.verified,.sa-badge.accepted,.sa-badge.completed,.sa-badge.published,.sa-badge.resolved {
    background: #ecfdf3;
    color: #087443
}

.sa-badge.pending,.sa-badge.submitted,.sa-badge.open,.sa-badge.quoted {
    background: #fff7e6;
    color: #a15c00
}

.sa-badge.rejected,.sa-badge.suspended,.sa-badge.cancelled,.sa-badge.hidden {
    background: #fef3f2;
    color: #b42318
}

.sa-badge.confirmed,.sa-badge.in_progress,.sa-badge.reviewing,.sa-badge.booked {
    background: #edf4ff;
    color: #245ebd
}

.sa-badge.withdrawn,.sa-badge.closed {
    background: #f2f4f7;
    color: #475467
}

.sa-row-link {
    display: block;
    margin-top: 4px;
    color: #1265d6;
    text-decoration: none;
    font-size: .59rem;
    font-weight: 800
}

.sa-number-link {
    display: inline-flex;
    min-width: 27px;
    height: 27px;
    align-items: center;
    justify-content: center;
    border-radius: 7px;
    background: #edf4ff;
    color: #1265d6;
    text-decoration: none;
    font-weight: 850
}

.sa-inline-form {
    display: flex;
    align-items: center;
    gap: 5px;
    min-width: 190px
}

.sa-inline-form select {
    min-height: 34px;
    border: 1px solid #d7deea;
    border-radius: 7px;
    background: #fff;
    padding: 5px 25px 5px 8px;
    color: #475467;
    font-size: .65rem
}

.sa-small-btn {
    min-height: 34px;
    border: 0;
    border-radius: 7px;
    background: #1265d6;
    color: #fff;
    padding: 6px 9px;
    font-size: .62rem;
    font-weight: 800;
    cursor: pointer
}

.sa-rating {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #a15c00;
    font-weight: 800
}

.sa-empty {
    padding: 38px;
    text-align: center;
    color: #8490a2;
    font-size: .75rem
}

.sa-admin .admin-kyc-grid {
    margin-top: 0
}

.sa-admin .admin-kyc-grid .svc-panel {
    box-shadow: none
}

@media(max-width: 950px) {
    .sa-hero {
        align-items:flex-start;
        flex-direction: column
    }

    .sa-hero-actions {
        width: 100%
    }

    .sa-dashboard-grid {
        grid-template-columns: 1fr
    }

    .sa-stats {
        grid-template-columns: repeat(2,1fr)
    }
}

@media(max-width: 650px) {
    .sa-hero {
        padding:20px
    }

    .sa-hero-content {
        align-items: flex-start
    }

    .sa-hero-icon {
        width: 46px;
        height: 46px;
        flex-basis: 46px
    }

    .sa-hero h1 {
        font-size: 1.3rem
    }

    .sa-hero-actions {
        align-items: stretch;
        flex-direction: column
    }

    .sa-count {
        width: 100%
    }

    .sa-dashboard-btn {
        width: 100%
    }

    .sa-stats,.sa-mini-stats,.sa-menu-grid {
        grid-template-columns: 1fr
    }

    .sa-panel {
        padding: 14px
    }

    .sa-table {
        min-width: 850px
    }
}

/* Admin-controlled Services workflow */
.sa-badge.pending_admin {
    background: #fff7e6;
    color: #a15c00
}

.sa-badge.approved {
    background: #ecfdf3;
    color: #087443
}

.sa-badge.customer_selected {
    background: #eef4ff;
    color: #245ebd
}

.sa-badge.admin_rejected,.sa-badge.customer_rejected,.sa-badge.rejected {
    background: #fef3f2;
    color: #b42318
}

.sa-badge.customer_accepted {
    background: #e8f7ff;
    color: #075985
}

.sa-badge.booked {
    background: #edf4ff;
    color: #245ebd
}

.sa-badge.disputed {
    background: #fff1f2;
    color: #be123c
}

.sa-action-stack {
    display: grid;
    gap: 6px;
    min-width: 210px
}

.sa-action-stack>input {
    width: 100%;
    min-height: 34px;
    border: 1px solid #d7deea;
    border-radius: 7px;
    padding: 6px 8px;
    font-size: .64rem
}

.sa-action-stack>div {
    display: flex;
    gap: 5px
}

.sa-danger {
    background: #b42318
}

.sa-link-btn {
    text-decoration: none
}

.sa-final-panel {
    margin-bottom: 14px;
    border-color: #bfd2fb
}

.sa-final-grid {
    display: grid;
    gap: 8px
}

.sa-final-grid article {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    padding: 13px;
    border-radius: 10px;
    background: #f7faff
}

.sa-final-grid small {
    color: #1265d6;
    font-size: .6rem;
    font-weight: 800
}

.sa-final-grid h3 {
    margin: 2px 0;
    color: #25324a;
    font-size: .82rem
}

.sa-final-grid p {
    margin: 0;
    color: #758095;
    font-size: .66rem
}

.customer-access-box {
    margin-top: 12px;
    padding: 12px;
    border: 1px solid #abefc6;
    border-radius: 9px;
    background: #fff;
    color: #087443
}

.customer-access-box strong,.customer-access-box p,.customer-access-box a {
    display: block
}

.customer-access-box p {
    margin: 4px 0;
    font-size: .75rem
}

.customer-access-box a {
    overflow-wrap: anywhere;
    color: #1265d6;
    font-weight: 800
}

.customer-status-page {
    padding-bottom: 55px
}

.customer-request-summary,.customer-quote-panel {
    max-width: 1050px;
    margin: 16px auto;
    padding: 20px;
    border: 1px solid #e1e7f0;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 5px 18px rgba(15,23,42,.04)
}

.customer-request-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px
}

.customer-request-summary small,.customer-quote-head small,.customer-quote-provider small,.customer-quote-price small {
    color: #1265d6;
    font-size: .62rem;
    font-weight: 850;
    letter-spacing: .07em
}

.customer-request-summary h2,.customer-quote-head h2 {
    margin: 3px 0;
    color: #25324a
}

.customer-request-summary p,.customer-quote-head p {
    margin: 0;
    color: #758095;
    font-size: .75rem
}

.customer-quote-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 12px;
    margin-top: 16px
}

.customer-quote-card {
    padding: 17px;
    border: 1px solid #e1e7f0;
    border-radius: 12px;
    background: #fff
}

.customer-quote-provider {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px
}

.customer-quote-provider h3 {
    margin: 3px 0;
    color: #25324a;
    font-size: .92rem
}

.customer-quote-provider p {
    margin: 0;
    color: #8490a2;
    font-size: .65rem
}

.customer-quote-provider>span {
    padding: 5px 7px;
    border-radius: 999px;
    background: #ecfdf3;
    color: #087443;
    font-size: .59rem;
    font-weight: 800
}

.customer-quote-price {
    margin: 14px 0;
    padding: 12px;
    border-radius: 9px;
    background: #f7faff
}

.customer-quote-price strong {
    display: block;
    margin-top: 2px;
    color: #17233d;
    font-size: 1.35rem
}

.customer-quote-card>p {
    color: #667085;
    font-size: .7rem;
    line-height: 1.5
}

.customer-rating {
    color: #a15c00;
    font-size: .67rem;
    font-weight: 750
}

.customer-quote-actions form {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 7px;
    margin-top: 14px
}

.customer-quote-actions button {
    min-height: 39px;
    border-radius: 8px;
    padding: 8px 12px;
    font-size: .7rem;
    font-weight: 800;
    cursor: pointer
}

.customer-accept {
    border: 0;
    background: #1265d6;
    color: #fff
}

.customer-reject {
    border: 1px solid #d7deea;
    background: #fff;
    color: #b42318
}

.customer-decision {
    display: inline-flex;
    margin-top: 13px;
    padding: 6px 9px;
    border-radius: 999px;
    background: #f2f4f7;
    color: #475467;
    font-size: .64rem;
    font-weight: 800
}

.provider-contact-release {
    margin-top: 13px;
    padding: 12px;
    border: 1px solid #abefc6;
    border-radius: 9px;
    background: #ecfdf3;
    color: #087443
}

.provider-contact-release p {
    margin: 4px 0 0;
    font-size: .7rem
}

@media(max-width: 700px) {
    .customer-quote-grid {
        grid-template-columns:1fr
    }

    .customer-request-summary,.customer-quote-provider,.sa-final-grid article {
        align-items: flex-start;
        flex-direction: column
    }

    .customer-quote-actions form {
        grid-template-columns: 1fr
    }

    .sa-action-stack {
        min-width: 190px
    }
}

/* Provider Requests + Quotes workflow */
.pp-request-list,.pp-quote-list {
    display: grid;
    gap: 15px
}

.pp-request-item,.pp-my-quote {
    border: 1px solid #e4e7ec;
    border-radius: 14px;
    padding: 18px;
    background: #fff
}

.pp-request-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px
}

.pp-request-top h3 {
    margin: 3px 0 0;
    font-size: 17px;
    color: #101828
}

.pp-request-code {
    font-size: 11px;
    font-weight: 800;
    color: #175cd3;
    text-transform: uppercase;
    letter-spacing: .04em
}

.pp-status {
    display: inline-flex;
    padding: 6px 9px;
    border-radius: 999px;
    background: #eef4ff;
    color: #175cd3;
    font-size: 11px;
    font-weight: 750
}

.pp-request-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin: 13px 0;
    color: #667085;
    font-size: 12px
}

.pp-request-meta span {
    display: flex;
    align-items: center;
    gap: 5px
}

.pp-requirement {
    padding: 12px 14px;
    border-radius: 10px;
    background: #f8fafc
}

.pp-requirement strong {
    font-size: 12px;
    color: #344054
}

.pp-requirement p {
    margin: 4px 0 0;
    color: #667085;
    font-size: 13px;
    line-height: 1.55
}

.pp-quote-box {
    margin-top: 14px;
    border: 1px solid #dbe5f3;
    border-radius: 11px;
    background: #fbfdff
}

.pp-quote-box summary {
    cursor: pointer;
    list-style: none;
    padding: 12px 14px;
    color: #175cd3;
    font-size: 13px;
    font-weight: 750
}

.pp-quote-box summary::-webkit-details-marker {
    display: none
}

.pp-quote-form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    padding: 0 14px 14px
}

.pp-quote-form label span {
    display: block;
    margin-bottom: 5px;
    color: #475467;
    font-size: 11px;
    font-weight: 700
}

.pp-quote-form input,.pp-quote-form textarea {
    width: 100%;
    border: 1px solid #d0d5dd;
    border-radius: 9px;
    padding: 10px 11px;
    font: inherit;
    font-size: 13px
}

.pp-quote-form .full {
    grid-column: 1/-1
}

.pp-quote-actions {
    display: flex;
    justify-content: flex-end
}

.pp-quote-sent {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 14px;
    padding: 11px 13px;
    border-radius: 10px;
    background: #ecfdf3;
    color: #067647
}

.pp-quote-sent>div {
    display: flex;
    align-items: center;
    gap: 9px
}

.pp-quote-sent strong,.pp-quote-sent small {
    display: block
}

.pp-quote-sent small {
    font-size: 11px
}

.pp-quote-sent a {
    font-size: 12px;
    font-weight: 750;
    color: #067647
}

.pp-quote-summary {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin: 14px 0
}

.pp-quote-summary>div {
    padding: 12px;
    border: 1px solid #edf0f4;
    border-radius: 10px;
    background: #f8fafc
}

.pp-quote-summary small,.pp-quote-summary strong {
    display: block
}

.pp-quote-summary small {
    font-size: 10px;
    color: #667085;
    text-transform: uppercase;
    font-weight: 750
}

.pp-quote-summary strong {
    margin-top: 3px;
    color: #101828;
    font-size: 16px
}

.pp-quote-note {
    margin: 8px 0;
    color: #667085;
    font-size: 12px;
    line-height: 1.5
}

.pp-withdraw-form {
    margin-top: 10px
}

.pp-link-danger {
    border: 0;
    background: transparent;
    padding: 0;
    color: #b42318;
    font-size: 12px;
    font-weight: 700
}

.pp-muted-note {
    margin-top: 13px;
    color: #98a2b3;
    font-size: 12px
}

@media(max-width: 650px) {
    .pp-request-top,.pp-quote-sent {
        align-items:flex-start;
        flex-direction: column
    }

    .pp-quote-form,.pp-quote-summary {
        grid-template-columns: 1fr
    }

    .pp-quote-form .full {
        grid-column: auto
    }

    .pp-quote-actions .pp-btn {
        width: 100%
    }
}

/* Admin direct customer contact */
.sa-contact-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    min-width: 270px
}

.sa-contact-note {
    display: block;
    margin-top: 6px;
    max-width: 300px;
    color: #7b8798;
    font-size: .59rem;
    line-height: 1.35
}

.sa-whatsapp {
    background: #168b55!important;
    color: #fff!important;
    text-decoration: none
}

.sa-consent {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    margin: 8px 0;
    color: #475467;
    font-size: .62rem;
    line-height: 1.4
}

@media(max-width: 750px) {
    .sa-contact-actions {
        min-width:220px
    }
}

/* Service Providers - View More / details popup */
.sa-view-more {
    margin-top: 7px;
    border: 0;
    background: transparent;
    padding: 0;
    color: #175cd3;
    font: inherit;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 5px
}

.sa-provider-modal-row {
    height: 0!important
}

.sa-provider-modal-row>td {
    padding: 0!important;
    border: 0!important;
    height: 0!important
}

.sa-provider-modal {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 99999;
    align-items: center;
    justify-content: center;
    padding: 20px
}

.sa-provider-modal.is-open {
    display: flex
}

.sa-provider-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(16,24,40,.64);
    backdrop-filter: blur(3px)
}

.sa-provider-modal-dialog {
    position: relative;
    width: min(760px,100%);
    max-height: 88vh;
    overflow: auto;
    background: #fff;
    border-radius: 18px;
    padding: 24px;
    box-shadow: 0 24px 80px rgba(16,24,40,.25)
}

.sa-provider-modal-close {
    position: absolute;
    right: 18px;
    top: 18px;
    width: 38px;
    height: 38px;
    border: 1px solid #eaecf0;
    border-radius: 10px;
    background: #fff;
    cursor: pointer
}

.sa-provider-modal-head {
    display: flex;
    align-items: center;
    gap: 14px;
    padding-right: 50px;
    margin-bottom: 22px
}

.sa-provider-avatar {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    background: #eff8ff;
    color: #175cd3;
    font-size: 24px
}

.sa-provider-modal-head small,.sa-provider-detail-block>span,.sa-provider-detail-grid span {
    display: block;
    color: #667085;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em
}

.sa-provider-modal-head h2 {
    margin: 3px 0;
    font-size: 22px
}

.sa-provider-modal-head p {
    margin: 0;
    color: #667085
}

.sa-provider-detail-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 12px;
    margin-bottom: 14px
}

.sa-provider-detail-grid>div,.sa-provider-detail-block {
    border: 1px solid #eaecf0;
    border-radius: 12px;
    padding: 13px;
    background: #fcfcfd
}

.sa-provider-detail-grid strong {
    display: block;
    margin-top: 5px;
    overflow-wrap: anywhere
}

.sa-provider-detail-block {
    margin-top: 12px
}

.sa-provider-detail-block p {
    margin: 6px 0 0;
    line-height: 1.55
}

.sa-service-area-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 9px
}

.sa-service-area-chips span {
    padding: 7px 10px;
    border-radius: 999px;
    background: #eff8ff;
    color: #175cd3;
    font-size: 12px;
    font-weight: 700;
    text-transform: none;
    letter-spacing: 0
}

.sa-provider-modal-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 18px
}

.sa-modal-done {
    border: 1px solid #d0d5dd;
    background: #fff;
    border-radius: 9px;
    padding: 8px 14px;
    font-weight: 700;
    cursor: pointer
}

body.sa-modal-open {
    overflow: hidden
}

/* HomeofIndia Provider Bookings — standalone professional provider UI */
.pb-page{display:grid;gap:16px}.pb-overview{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:20px 22px;border-radius:18px;background:#101828;color:#fff;box-shadow:0 10px 28px rgba(16,24,40,.12)}.pb-overview:after{content:"";position:absolute;width:180px;height:180px;border-radius:50%;right:-70px;top:-100px;background:rgba(255,255,255,.05)}.pb-overview-copy{position:relative;z-index:1}.pb-kicker{display:inline-flex;gap:6px;align-items:center;font-size:10px;font-weight:800;letter-spacing:.1em;color:#84caff}.pb-overview h2{margin:5px 0 3px;font-size:22px}.pb-overview p{margin:0;max-width:580px;color:#d0d5dd;font-size:12px}.pb-overview-metrics{position:relative;z-index:1;display:flex;gap:7px}.pb-overview-metrics div{min-width:78px;padding:9px 11px;border:1px solid rgba(255,255,255,.12);border-radius:11px;background:rgba(255,255,255,.07);text-align:center}.pb-overview-metrics strong{display:block;font-size:18px}.pb-overview-metrics span{font-size:9px;color:#d0d5dd}
.pb-list{display:grid;gap:13px}.pb-card{overflow:hidden;border:1px solid #e4e7ec;border-radius:16px;background:#fff;box-shadow:0 4px 16px rgba(16,24,40,.045);transition:box-shadow .2s,border-color .2s}.pb-card:hover{border-color:#d0d5dd;box-shadow:0 8px 24px rgba(16,24,40,.07)}.pb-card-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 14px;border-bottom:1px solid #f0f1f3}.pb-id{display:flex;align-items:center;gap:9px}.pb-icon{width:34px;height:34px;display:grid;place-items:center;border-radius:9px;background:#eff8ff;color:#1570ef}.pb-id small{display:block;color:#667085;font-size:9px;font-weight:700}.pb-id h3{margin:1px 0 0;font-size:13px}.pb-top-right{display:flex;align-items:center;gap:9px}.pb-top-right>strong{font-size:14px;color:#101828}.pb-status{padding:5px 8px;border-radius:999px;background:#f2f4f7;font-size:9px;font-weight:800}.pb-confirmed{background:#eff8ff;color:#175cd3}.pb-in_progress{background:#fffaeb;color:#b54708}.pb-completed{background:#ecfdf3;color:#027a48}.pb-disputed{background:#fef3f2;color:#b42318}
.pb-content{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(300px,.6fr);gap:12px;padding:12px 14px}.pb-job{min-width:0}.pb-meta{display:grid;grid-template-columns:1fr 1fr;gap:8px}.pb-meta>div{display:flex;align-items:center;gap:8px;padding:8px 9px;background:#f9fafb;border-radius:9px}.pb-meta i{color:#1570ef}.pb-meta small{display:block;font-size:8px;font-weight:700;text-transform:uppercase;color:#98a2b3;letter-spacing:.04em}.pb-meta strong{display:block;margin-top:1px;font-size:10px;color:#344054}.pb-requirement{margin-top:8px;padding:9px 10px;border:1px solid #eaecf0;border-radius:9px}.pb-requirement>span{font-size:9px;font-weight:800;text-transform:uppercase;color:#667085}.pb-requirement p{margin:4px 0 0;font-size:11px;line-height:1.4;color:#475467}
.pb-contact{padding:10px;border:1px solid #a6f4c5;border-radius:11px;background:linear-gradient(145deg,#f6fef9,#ecfdf3)}.pb-contact-head{display:flex;align-items:center;gap:8px}.pb-contact-head>span{width:30px;height:30px;display:grid;place-items:center;border-radius:8px;background:#d1fadf;color:#039855}.pb-contact-head small{display:block;font-size:11px;letter-spacing:.06em;font-weight:800;color:#067647}.pb-contact-head h4{margin:1px 0 0;font-size:11px}.pb-address{display:flex;gap:6px;margin:8px 0;padding-top:7px;border-top:1px solid #d1fadf;font-size:9px;line-height:1.35;color:#475467}.pb-address i{color:#039855}.pb-contact-buttons{display:grid;grid-template-columns:1fr;gap:6px}.pb-contact-buttons a{display:flex;align-items:center;gap:6px;padding:7px 8px;border-radius:8px;color:#fff;text-decoration:none;min-width:0;font-size:12px;font-weight:700}.pb-contact-buttons a span{min-width:0;overflow-wrap:anywhere}.pb-contact-buttons small{display:block;font-size:6px;opacity:.8}.pb-call{background:#039855}.pb-mail{background:#1570ef}.pb-locked{border-color:#eaecf0;background:#f9fafb}.pb-locked .pb-contact-head>span{background:#eaecf0;color:#667085}.pb-locked .pb-contact-head small{color:#667085}.pb-locked p{margin:8px 0 0;font-size:9px;line-height:1.4;color:#667085}
.pb-card-bottom{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 14px;background:#fcfcfd;border-top:1px solid #f0f1f3}.pb-trust{font-size:8px;color:#667085}.pb-trust i{color:#039855}.pb-card-bottom button{display:inline-flex;align-items:center;gap:5px;border:0;border-radius:8px;background:#1570ef;color:#fff;padding:7px 11px;font-size:9px;font-weight:800;cursor:pointer}.pb-empty{text-align:center;padding:38px 20px;border:1px solid #e4e7ec;border-radius:16px;background:#fff}.pb-empty>span{width:48px;height:48px;margin:auto;display:grid;place-items:center;border-radius:14px;background:#eff8ff;color:#1570ef;font-size:21px}.pb-empty h3{margin:9px 0 3px}.pb-empty p{margin:0;color:#667085;font-size:11px}
@media(max-width:900px){.pb-content{grid-template-columns:1fr}.pb-overview{align-items:flex-start;flex-direction:column}.pb-overview-metrics{width:100%}.pb-overview-metrics div{flex:1}}@media(max-width:600px){.pb-overview{padding:16px}.pb-overview-metrics{gap:5px}.pb-overview-metrics div{min-width:0;padding:7px 4px}.pb-meta,.pb-contact-buttons{grid-template-columns:1fr}.pb-card-top{align-items:flex-start}.pb-top-right{align-items:flex-end;flex-direction:column}.pb-card-bottom{align-items:flex-start;flex-direction:column}.pb-card-bottom form,.pb-card-bottom button{width:100%;justify-content:center}}


@media(max-width: 640px) {
    .sa-provider-modal {
        padding:10px
    }

    .sa-provider-modal-dialog {
        padding: 18px;
        max-height: 94vh
    }

    .sa-provider-detail-grid {
        grid-template-columns: 1fr
    }

    .sa-provider-modal-head h2 {
        font-size: 18px
    }
}

/* service provider add */
/* HomeofIndia - Admin Service Provider Add | mirrors service-providers.php */
.sa-admin .provider-add-stats b{font-size:1rem;display:flex;align-items:center;gap:9px}
.sa-admin .provider-add-stats b i{color:#2563eb}
.sa-admin .provider-add-form{display:grid;gap:20px;margin:20px 0 42px}
.sa-admin .provider-add-panel{overflow:hidden}
.sa-admin .provider-add-panel .sa-panel-head{margin-bottom:22px}
.sa-admin .provider-add-panel .sa-panel-head h2{display:flex;align-items:center;gap:10px}
.sa-admin .provider-add-panel .sa-panel-head h2 i{color:#2563eb;font-size:1.15rem}
.sa-admin .provider-add-panel .sa-panel-head p{color:#64748b;font-size:.9rem;margin:7px 0 0}
.sa-admin .provider-add-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:19px 22px}
.sa-admin .provider-add-full{grid-column:1/-1}
.sa-admin .provider-add-field{min-width:0}
.sa-admin .provider-add-field>label{display:block;margin:0 0 8px;font-size:.9rem;font-weight:750;color:#334155}
.sa-admin .provider-add-field>label span{color:#dc2626}
.sa-admin .provider-add-field input:not([type=checkbox]),.sa-admin .provider-add-field select,.sa-admin .provider-add-field textarea{display:block;width:100%;min-width:0;border:1px solid #d6dfec;background:#fff;border-radius:11px;padding:12px 14px;font:inherit;color:#0f172a;transition:border-color .2s,box-shadow .2s}
.sa-admin .provider-add-field textarea{resize:vertical;min-height:105px}
.sa-admin .provider-add-field input:focus,.sa-admin .provider-add-field select:focus,.sa-admin .provider-add-field textarea:focus{outline:none;border-color:#2563eb;box-shadow:0 0 0 4px rgba(37,99,235,.1)}
.sa-admin .provider-add-checks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.sa-admin .provider-add-check{display:flex;align-items:center;gap:10px;padding:12px 14px;border:1px solid #e2e8f0;border-radius:11px;background:#f8fafc;cursor:pointer;font-weight:600;font-size:.87rem;min-width:0}
.sa-admin .provider-add-check:has(input:checked){background:#eff6ff;border-color:#93c5fd;color:#1d4ed8}
.sa-admin .provider-add-check input{width:17px;height:17px;accent-color:#2563eb;flex-shrink:0}
.sa-admin .provider-add-areas{margin-top:22px}
.sa-admin .provider-add-hint{font-size:.82rem;color:#64748b;margin:8px 0 0}
.sa-admin .provider-add-note{display:flex;gap:12px;align-items:flex-start;background:#eff6ff;border:1px solid #bfdbfe;border-radius:12px;padding:15px;color:#1e40af}
.sa-admin .provider-add-note>i{font-size:1.35rem}
.sa-admin .provider-add-note p{margin:5px 0 0;color:#475569;font-size:.85rem;line-height:1.55}
.sa-admin .provider-add-actions{display:flex;justify-content:flex-end;align-items:center;flex-wrap:wrap;gap:12px}
.sa-admin .provider-add-cancel,.sa-admin .provider-add-submit{display:inline-flex;justify-content:center;align-items:center;gap:9px;padding:12px 19px;border-radius:11px;font-weight:750;text-decoration:none;min-height:46px}
.sa-admin .provider-add-cancel{background:#fff;border:1px solid #d6dfec;color:#475569}
.sa-admin .provider-add-submit{background:#2563eb;border:1px solid #2563eb;color:#fff;cursor:pointer}
.sa-admin .provider-add-submit:hover{background:#1d4ed8}
.sa-admin .provider-add-error{display:flex;gap:12px;background:#fef2f2;color:#991b1b;border:1px solid #fecaca;padding:16px;border-radius:12px;margin-top:16px}
.sa-admin .provider-add-error ul{margin:7px 0 0;padding-left:20px}
@media(max-width:900px){.sa-admin .provider-add-checks{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.sa-admin .provider-add-grid{grid-template-columns:minmax(0,1fr)}.sa-admin .provider-add-full{grid-column:auto}.sa-admin .provider-add-checks{grid-template-columns:minmax(0,1fr)}.sa-admin .provider-add-actions{flex-direction:column-reverse;align-items:stretch}.sa-admin .provider-add-actions>*{width:100%}.sa-admin .provider-add-panel .sa-panel-head h2{font-size:1.15rem}}

/* provide kyc */
.provider-add-kyc{padding:20px 24px}.provider-add-kyc-toggle{display:flex;align-items:flex-start;gap:12px;padding:15px 18px;margin-bottom:18px;border:1px solid #dbe5f0;border-radius:12px;background:#f8fbff;font-weight:600;color:#253858;cursor:pointer}.provider-add-kyc-toggle input{width:18px;height:18px;flex:none;margin-top:2px;accent-color:#2563eb}.provider-add-kyc #admin-kyc-fields{border-top:1px solid #e5eaf2;padding-top:22px}.provider-add-kyc #admin-kyc-fields[hidden]{display:none}.provider-add-kyc .provider-add-grid{margin-bottom:18px}.provider-add-kyc input[type=file]{width:100%;max-width:100%;padding:12px;border:1px solid #dbe5f0;border-radius:10px;background:#fff}.provider-add-kyc small{display:block;color:#64748b;font-size:12px;margin-top:6px}.provider-add-kyc .provider-add-hint{color:#64748b;margin:10px 0 0}@media(max-width:640px){.provider-add-kyc{padding:16px}.provider-add-kyc .provider-add-grid{display:grid;grid-template-columns:1fr;gap:16px}.provider-add-kyc-toggle{padding:12px}}