/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Sep 14 2026 | 09:04:10 */
/*
============================================================
DAMIAN PHILPOTT — CUSTOMER ACCOUNT
DESKTOP ONLY
PAGE ID: 1180

Background:
https://damianphilpott.com/images/customerpanel.png

IMPORTANT:
- Does NOT alter the site header/container width
- Full-bleed image belongs only to the Customer Account article
- No repeating image
- Mobile/tablet untouched
============================================================
*/

@media only screen and (min-width: 1001px) {


/* =========================================================
   PAGE ROW
   Keep the theme's normal container sizing.
   Only remove the forced page height / unwanted spacing.
   ========================================================= */

body.page-id-1180 .main-row {
    min-height: 0 !important;
    height: auto !important;

    padding-top: 0 !important;
    padding-bottom: 0 !important;

    background: #000000 !important;
}


/* Do NOT resize .main-row > .container
   The theme keeps control of its normal site width. */


/* =========================================================
   CUSTOMER ACCOUNT ARTICLE
   Full bleed without changing the site's global container.
   ========================================================= */

body.page-id-1180 article#post-1180 {
    position: relative !important;

    width: 100vw !important;
    max-width: none !important;

    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;

    padding: 77px 0 72px !important;

    background-color: #000000 !important;

    background-image:
        linear-gradient(
            90deg,
            rgba(0,0,0,0.02) 0%,
            rgba(0,0,0,0.05) 23%,
            rgba(0,0,0,0.16) 35%,
            rgba(0,0,0,0.55) 50%,
            rgba(0,0,0,0.88) 67%,
            rgba(0,0,0,0.98) 82%,
            #000000 100%
        ),
        url("https://damianphilpott.com/images/customerpanel.png") !important;

    background-position:
        left center,
        0 center !important;

    background-size:
        cover,
        cover !important;

    background-repeat:
        no-repeat,
        no-repeat !important;

    background-attachment:
        scroll,
        scroll !important;

    overflow: hidden !important;
}


/* Bottom fade into footer */

body.page-id-1180 article#post-1180::after {
    content: "" !important;

    position: absolute !important;

    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;

    height: 90px !important;

    background: linear-gradient(
        to bottom,
        rgba(0,0,0,0),
        #000000
    ) !important;

    pointer-events: none !important;

    z-index: 1 !important;
}


/* =========================================================
   INNER ACCOUNT CONTENT
   ========================================================= */

body.page-id-1180 article#post-1180 .site-content {
    position: relative !important;
    z-index: 2 !important;

    width: calc(100% - 80px) !important;
    max-width: 1160px !important;

    margin: 0 auto !important;
    padding: 0 !important;

    background: transparent !important;

    box-shadow: none !important;
}


body.page-id-1180 article#post-1180 .post-content,
body.page-id-1180 article#post-1180 .clearfix.post-content {
    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;

    box-shadow: none !important;
}


/* =========================================================
   PAGE TITLE
   ========================================================= */

body.page-id-1180 .page-title {
    width: 860px !important;
    max-width: 74% !important;

    margin: 0 0 28px auto !important;
    padding: 0 !important;
}


body.page-id-1180 .page-title h1,
body.page-id-1180 .page-title .h2 {
    position: relative !important;

    margin: 0 !important;
    padding: 0 0 20px !important;

    color: #FFFFFF !important;

    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 46px !important;
    font-weight: 400 !important;
    line-height: 1.05 !important;

    letter-spacing: -1.2px !important;
}


body.page-id-1180 .page-title h1::after,
body.page-id-1180 .page-title .h2::after {
    content: "" !important;

    position: absolute !important;

    left: 0 !important;
    bottom: 0 !important;

    width: 72% !important;
    height: 2px !important;

    background: #FFD700 !important;
}


/* =========================================================
   BOOKNETIC BLOCK
   ========================================================= */

body.page-id-1180 .wp-block-booknetic-customerpanel {
    position: relative !important;

    width: 860px !important;
    max-width: 74% !important;

    min-height: 0 !important;

    margin: 0 0 0 auto !important;
    padding: 0 !important;

    background: transparent !important;

    overflow: visible !important;
}


body.page-id-1180 .wp-block-booknetic-customerpanel::before,
body.page-id-1180 .wp-block-booknetic-customerpanel::after {
    display: none !important;
}


/* =========================================================
   BOOKNETIC BODY
   ========================================================= */

body.page-id-1180
.wp-block-booknetic-customerpanel
.booknetic-body {
    position: relative !important;

    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;
}


/* =========================================================
   MAIN CUSTOMER PANEL
   ========================================================= */

body.page-id-1180 #booknetic-customer-panel {
    position: relative !important;

    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    background: rgba(4,4,4,.94) !important;

    border: 1px solid rgba(255,215,0,.58) !important;
    border-radius: 2px !important;

    box-shadow:
        0 25px 80px rgba(0,0,0,.62),
        0 0 0 1px rgba(255,255,255,.015) inset !important;

    overflow: hidden !important;

    backdrop-filter: blur(4px) !important;
    -webkit-backdrop-filter: blur(4px) !important;
}


/* =========================================================
   PANEL CONTAINER
   ========================================================= */

body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-container {
    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;

    border: 0 !important;
    border-radius: 0 !important;

    box-shadow: none !important;

    overflow: hidden !important;
}


/* =========================================================
   ACCOUNT HEADER
   ========================================================= */

body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-header {
    position: relative !important;

    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    background:
        linear-gradient(
            90deg,
            rgba(255,215,0,.04),
            rgba(0,0,0,0) 44%
        ),
        #070707 !important;

    border-bottom: 1px solid #242424 !important;

    box-shadow: none !important;
}


body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-header-info {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    min-height: 96px !important;

    padding: 18px 24px !important;

    box-sizing: border-box !important;
}


/* =========================================================
   CUSTOMER CARD
   ========================================================= */

body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-header-customer-card {
    display: flex !important;
    align-items: center !important;

    gap: 14px !important;

    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;
}


body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-header-customer-card-img {
    width: 54px !important;
    height: 54px !important;
    min-width: 54px !important;

    margin: 0 !important;
    padding: 0 !important;

    background: #111111 !important;

    border: 1px solid #444444 !important;
    border-radius: 50% !important;

    overflow: hidden !important;
}


body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-header-customer-card-img img {
    display: block !important;

    width: 100% !important;
    height: 100% !important;

    object-fit: cover !important;

    filter: grayscale(100%) contrast(1.08) !important;
}


body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-header-customer-card-info {
    margin: 0 !important;
    padding: 0 !important;
}


body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-header-customer-card-info h2 {
    margin: 0 0 4px !important;
    padding: 0 !important;

    color: #FFFFFF !important;

    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 18px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;

    letter-spacing: .2px !important;
}


body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-header-customer-card-info p {
    margin: 3px 0 0 !important;
    padding: 0 !important;

    color: #858585 !important;

    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 10px !important;
    font-weight: 400 !important;
    line-height: 15px !important;
}


/* =========================================================
   POINTS
   ========================================================= */

body.page-id-1180
#booknetic-customer-panel
.booknetic-customer-point-badge {
    display: inline-flex !important;
    align-items: center !important;

    min-height: 18px !important;

    margin-left: 4px !important;
    padding: 2px 7px !important;

    background: transparent !important;

    color: #FFD700 !important;

    border: 1px solid rgba(255,215,0,.45) !important;
    border-radius: 20px !important;

    font-size: 8px !important;
    font-weight: 600 !important;
    line-height: 12px !important;

    box-shadow: none !important;
}


/* =========================================================
   LOGOUT
   ========================================================= */

body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-header-logout-btn {
    position: relative !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 7px !important;

    min-width: 98px !important;
    height: 34px !important;

    margin: 0 !important;
    padding: 0 14px !important;

    overflow: hidden !important;

    background: linear-gradient(
        135deg,
        #151515 0%,
        #070707 100%
    ) !important;

    color: #FFFFFF !important;

    border: 1px solid rgba(255,215,0,.68) !important;
    border-radius: 2px !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.035),
        0 4px 14px rgba(0,0,0,.18) !important;

    outline: none !important;

    font-size: 9px !important;
    font-weight: 600 !important;

    letter-spacing: .55px !important;

    text-transform: uppercase !important;

    cursor: pointer !important;

    transition:
        background .28s ease,
        border-color .28s ease,
        color .28s ease,
        box-shadow .28s ease,
        transform .18s ease !important;
}


body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-header-logout-btn span,
body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-header-logout-btn i {
    color: #E8E8E8 !important;
    -webkit-text-fill-color: #E8E8E8 !important;

    transition: color .28s ease !important;
}


body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-header-logout-btn svg {
    color: #E8E8E8 !important;
    fill: currentColor !important;
    stroke: currentColor !important;

    transition:
        color .28s ease,
        fill .28s ease,
        stroke .28s ease !important;
}


body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-header-logout-btn:hover {
    background: linear-gradient(
        135deg,
        #FFE44D 0%,
        #FFD700 42%,
        #C9A900 100%
    ) !important;

    color: #000000 !important;

    border-color: #FFD700 !important;

    box-shadow:
        0 0 0 1px rgba(255,215,0,.10),
        0 8px 22px rgba(0,0,0,.34),
        0 0 20px rgba(255,215,0,.14) !important;

    transform: translateY(-1px) !important;
}


body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-header-logout-btn:hover span,
body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-header-logout-btn:hover i,
body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-header-logout-btn:hover svg {
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
    fill: #000000 !important;
    stroke: #000000 !important;
}


body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-header-logout-btn:active {
    transform: translateY(0) !important;
}


/* =========================================================
   PANEL BODY
   ========================================================= */

body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-body {
    display: block !important;

    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    background: rgba(0,0,0,.90) !important;
}


/* =========================================================
   ACCOUNT TABS
   ========================================================= */

body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-tabs {
    position: relative !important;

    display: flex !important;
    flex-direction: row !important;
    align-items: stretch !important;

    width: 100% !important;
    height: 52px !important;

    margin: 0 !important;
    padding: 0 15px !important;

    background: #090909 !important;

    border: 0 !important;
    border-bottom: 1px solid #252525 !important;
    border-radius: 0 !important;

    box-sizing: border-box !important;

    overflow: visible !important;
}


body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-sidebar-toggle {
    display: none !important;
}


body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-tab-item {
    position: relative !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 6px !important;

    width: auto !important;
    min-width: 0 !important;
    height: 52px !important;

    margin: 0 !important;
    padding: 0 13px !important;

    background: transparent !important;

    color: #808080 !important;

    border: 0 !important;
    border-radius: 0 !important;

    box-shadow: none !important;
    outline: none !important;

    cursor: pointer !important;

    transition:
        color .2s ease,
        background-color .2s ease !important;
}


body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-tab-item:hover {
    color: #FFD700 !important;

    background: rgba(255,215,0,.025) !important;
}


body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-tab-item.active {
    color: #FFFFFF !important;

    background: linear-gradient(
        180deg,
        rgba(255,215,0,.055) 0%,
        rgba(255,215,0,.018) 60%,
        rgba(255,215,0,0) 100%
    ) !important;
}


body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-tab-item.active::after {
    content: "" !important;

    position: absolute !important;

    left: 13px !important;
    right: 13px !important;
    bottom: -1px !important;

    height: 2px !important;

    background: #FFD700 !important;
}


body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-tab-item i,
body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-tab-item svg {
    color: inherit !important;
    fill: currentColor !important;

    font-size: 10px !important;

    opacity: .88 !important;

    transition: color .2s ease, fill .2s ease !important;
}


body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-tab-item.active i,
body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-tab-item.active svg {
    color: #FFD700 !important;
    fill: #FFD700 !important;
}


body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-tab-item-name {
    color: inherit !important;

    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 9px !important;
    font-weight: 600 !important;
    line-height: 1 !important;

    letter-spacing: .45px !important;

    text-transform: uppercase !important;
}


/* =========================================================
   TAB CONTENT
   ========================================================= */

body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-tab-wrapper,
body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-tab {
    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;
}


body.page-id-1180
#booknetic-customer-panel
.booknetic-cp-tab-body {
    width: 100% !important;

    margin: 0 !important;
    padding: 22px 22px 28px !important;

    background: transparent !important;

    box-sizing: border-box !important;
}


/* =========================================================
   APPOINTMENTS TABLE
   ========================================================= */

body.page-id-1180
#booknetic_customer_panel_appointments_table {
    width: 100% !important;

    margin: 0 !important;

    background: transparent !important;

    border: 0 !important;
    border-collapse: collapse !important;
    border-spacing: 0 !important;

    box-shadow: none !important;

    font-family: Helvetica, Arial, sans-serif !important;
}


body.page-id-1180
#booknetic_customer_panel_appointments_table thead th {
    height: 38px !important;

    padding: 0 8px 9px !important;

    background: transparent !important;

    color: #858585 !important;

    border: 0 !important;
    border-bottom: 1px solid #3A3A3A !important;

    font-size: 8px !important;
    font-weight: 600 !important;
    line-height: 13px !important;

    letter-spacing: .55px !important;

    text-align: left !important;
    text-transform: uppercase !important;

    white-space: nowrap !important;
}


body.page-id-1180
#booknetic_customer_panel_appointments_table tbody tr {
    background: transparent !important;

    border: 0 !important;
    border-bottom: 1px solid #292929 !important;

    transition: background-color .18s ease !important;
}


body.page-id-1180
#booknetic_customer_panel_appointments_table tbody tr:hover {
    background: linear-gradient(
        90deg,
        rgba(255,255,255,.035) 0%,
        rgba(255,255,255,.018) 58%,
        rgba(255,255,255,0) 100%
    ) !important;
}


body.page-id-1180
#booknetic_customer_panel_appointments_table tbody td {
    min-height: 54px !important;

    padding: 12px 8px !important;

    background: transparent !important;

    color: #D0D0D0 !important;

    border: 0 !important;

    font-size: 10px !important;
    font-weight: 400 !important;
    line-height: 16px !important;

    vertical-align: middle !important;
}


body.page-id-1180
#booknetic_customer_panel_appointments_table tbody td:first-child {
    color: #5E5E5E !important;

    font-size: 9px !important;
}


body.page-id-1180
#booknetic_customer_panel_appointments_table tbody td:nth-child(2) {
    color: #FFFFFF !important;

    font-weight: 600 !important;
}


body.page-id-1180
#booknetic_customer_panel_appointments_table tbody td:nth-child(5) {
    color: #FFD700 !important;

    font-weight: 600 !important;

    white-space: nowrap !important;
}


body.page-id-1180
#booknetic_customer_panel_appointments_table tbody td:nth-child(6) {
    color: #A5A5A5 !important;

    white-space: nowrap !important;
}


body.page-id-1180
#booknetic_customer_panel_appointments_table .td_datetime {
    color: #D2D2D2 !important;

    white-space: nowrap !important;
}


/* =========================================================
   STAFF
   ========================================================= */

body.page-id-1180
#booknetic_customer_panel_appointments_table
.user_visit_card {
    display: flex !important;
    align-items: center !important;

    gap: 7px !important;
}


body.page-id-1180
#booknetic_customer_panel_appointments_table
.circle_image {
    width: 25px !important;
    height: 25px !important;
    min-width: 25px !important;

    border: 1px solid #383838 !important;
    border-radius: 50% !important;

    overflow: hidden !important;
}


body.page-id-1180
#booknetic_customer_panel_appointments_table
.circle_image img {
    display: block !important;

    width: 100% !important;
    height: 100% !important;

    object-fit: cover !important;

    filter: grayscale(100%) !important;
}


body.page-id-1180
#booknetic_customer_panel_appointments_table
.user_visit_details {
    display: flex !important;
    flex-direction: column !important;

    gap: 0 !important;
}


body.page-id-1180
#booknetic_customer_panel_appointments_table
.user_visit_details span {
    color: #C6C6C6 !important;

    font-size: 9px !important;
    line-height: 14px !important;
}


/* =========================================================
   STATUS PILLS
   Booknetic backend controls each status colour.
   CSS below controls shape/typography only.
   ========================================================= */

body.page-id-1180
#booknetic_customer_panel_appointments_table
.booknetic_appointment_status_td
.booknetic_appointment_status_all {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-width: 58px !important;
    height: 22px !important;

    padding: 0 8px !important;

    border-radius: 20px !important;

    font-size: 8px !important;
    font-weight: 600 !important;
    line-height: 1 !important;

    letter-spacing: .3px !important;

    text-transform: uppercase !important;

    box-shadow: inset 0 0 0 1px rgba(255,255,255,.035) !important;
}


/* =========================================================
   FORMS
   ========================================================= */

body.page-id-1180
#booknetic-customer-panel
.bookentic-cp-user-form-item {
    margin-bottom: 20px !important;
}


body.page-id-1180
#booknetic-customer-panel
.bookentic-cp-form-label {
    display: block !important;

    margin: 0 0 7px !important;

    color: #858585 !important;

    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 9px !important;
    font-weight: 600 !important;

    letter-spacing: .65px !important;

    text-transform: uppercase !important;
}


body.page-id-1180
#booknetic-customer-panel
.bookentic-cp-form-control,
body.page-id-1180
#booknetic-customer-panel input[type="text"],
body.page-id-1180
#booknetic-customer-panel input[type="email"],
body.page-id-1180
#booknetic-customer-panel input[type="tel"],
body.page-id-1180
#booknetic-customer-panel input[type="password"] {
    width: 100% !important;
    min-height: 40px !important;

    padding: 0 11px !important;

    background: #080808 !important;

    color: #FFFFFF !important;

    border: 1px solid #313131 !important;
    border-radius: 2px !important;

    box-shadow: none !important;
    outline: none !important;

    font-size: 11px !important;

    box-sizing: border-box !important;
}


body.page-id-1180
#booknetic-customer-panel
.bookentic-cp-form-control:focus,
body.page-id-1180
#booknetic-customer-panel input:focus {
    border-color: #FFD700 !important;
}


/* =========================================================
   BUTTONS
   ========================================================= */

body.page-id-1180
#booknetic-customer-panel button[type="submit"],
body.page-id-1180
#booknetic-customer-panel .booknetic_btn_primary {
    min-height: 38px !important;

    padding: 0 17px !important;

    background: #FFD700 !important;

    color: #000000 !important;

    border: 1px solid #FFD700 !important;
    border-radius: 2px !important;

    box-shadow: none !important;

    font-size: 9px !important;
    font-weight: 700 !important;

    letter-spacing: .5px !important;

    text-transform: uppercase !important;
}


body.page-id-1180
#booknetic-customer-panel button[type="submit"]:hover,
body.page-id-1180
#booknetic-customer-panel .booknetic_btn_primary:hover {
    background: #000000 !important;

    color: #FFD700 !important;
}


/* =========================================================
   EMAIL PREFERENCES
   ========================================================= */

body.page-id-1180
#booknetic-tab-email-preferences table {
    width: 100% !important;

    background: transparent !important;
}


body.page-id-1180
#booknetic-tab-email-preferences
.table-gray-2 thead th {
    background: transparent !important;

    color: #747474 !important;

    border-bottom: 1px solid #343434 !important;

    font-size: 8px !important;

    letter-spacing: .55px !important;

    text-transform: uppercase !important;
}


body.page-id-1180
#booknetic-tab-email-preferences
.table-gray-2 tbody td {
    background: transparent !important;

    color: #D0D0D0 !important;

    border-bottom: 1px solid #202020 !important;
}


/* =========================================================
   SCROLLBAR
   ========================================================= */

body.page-id-1180
#booknetic-customer-panel * {
    scrollbar-width: thin;

    scrollbar-color: #505050 #090909;
}


body.page-id-1180
#booknetic-customer-panel *::-webkit-scrollbar {
    width: 6px !important;
    height: 6px !important;
}


body.page-id-1180
#booknetic-customer-panel *::-webkit-scrollbar-track {
    background: #090909 !important;
}


body.page-id-1180
#booknetic-customer-panel *::-webkit-scrollbar-thumb {
    background: #505050 !important;

    border-radius: 10px !important;
}


body.page-id-1180
#booknetic-customer-panel *::-webkit-scrollbar-thumb:hover {
    background: #FFD700 !important;
}


/* =========================================================
   CLEANUP / BOX SIZING
   ========================================================= */

body.page-id-1180
#booknetic-customer-panel,
body.page-id-1180
#booknetic-customer-panel *,
body.page-id-1180
.wp-block-booknetic-customerpanel,
body.page-id-1180
.wp-block-booknetic-customerpanel * {
    box-sizing: border-box !important;
}



/* =========================================================
   LOYALTY POINTS POPOVER
   ========================================================= */

body.page-id-1180
#booknetic-customer-panel
.booknetic-customer-point-info {
    background: linear-gradient(
        180deg,
        rgba(18,18,18,.99) 0%,
        rgba(6,6,6,.99) 100%
    ) !important;

    border: 1px solid rgba(255,215,0,.45) !important;
    border-radius: 8px !important;

    color: #FFFFFF !important;

    box-shadow:
        0 14px 34px rgba(0,0,0,.58),
        0 0 20px rgba(255,215,0,.06) !important;

    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
}


body.page-id-1180
#booknetic-customer-panel
.booknetic-customer-point-info p {
    color: #B8B8B8 !important;
}


body.page-id-1180
#booknetic-customer-panel
.booknetic-customer-point-info p span {
    color: #FFFFFF !important;
    font-weight: 600 !important;
}


/* PROGRESS TRACK */

body.page-id-1180
#booknetic-customer-panel
.points-slider-wrapper {
    background: rgba(255,255,255,.08) !important;

    border: 1px solid rgba(255,215,0,.16) !important;
    border-radius: 999px !important;
}


/* FILLED PROGRESS */

body.page-id-1180
#booknetic-customer-panel
.points-slider-filled {
    background: linear-gradient(
        90deg,
        #B79600 0%,
        #FFD700 58%,
        #FFF1A8 100%
    ) !important;

    border-radius: 999px !important;

    box-shadow: 0 0 10px rgba(255,215,0,.22) !important;
}


/* MOVING LOYALTY MARKER — BOOKNETIC POSITIONING IS PRESERVED */

body.page-id-1180
#booknetic-customer-panel
.points-slider-thumb {
    background: #070707 !important;

    border: 1px solid #FFD700 !important;
    border-radius: 50% !important;

    box-shadow:
        0 0 0 3px rgba(255,215,0,.10),
        0 0 14px rgba(255,215,0,.30) !important;

    overflow: visible !important;
}


/* HIDE THE ORIGINAL CROWN WITHOUT ALTERING THE THUMB */

body.page-id-1180
#booknetic-customer-panel
.points-slider-thumb img {
    opacity: 0 !important;
    visibility: hidden !important;
}


/* REPLACE CROWN WITH THE BOOKNETIC COIN SVG */

body.page-id-1180
#booknetic-customer-panel
.points-slider-thumb::before {
    content: "" !important;

    position: absolute !important;
    inset: 3px !important;

    background-image: url("https://damianphilpott.com/wp-content/plugins/booknetic-loyalty-points/assets/frontend/icons/coin.svg") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;

    pointer-events: none !important;
}




/* =========================================================
   PACKAGES
   Package list, actions and package-booking popup close button
   ========================================================= */

body.page-id-1180
#booknetic_customer_panel_packages_table {
    width: 100% !important;

    margin: 0 !important;

    background: transparent !important;

    border: 0 !important;
    border-collapse: collapse !important;
    border-spacing: 0 !important;

    box-shadow: none !important;

    font-family: Helvetica, Arial, sans-serif !important;
}


body.page-id-1180
#booknetic_customer_panel_packages_table thead th {
    height: 38px !important;

    padding: 0 8px 9px !important;

    background: transparent !important;

    color: #858585 !important;

    border: 0 !important;
    border-bottom: 1px solid #3A3A3A !important;

    font-size: 8px !important;
    font-weight: 600 !important;
    line-height: 13px !important;

    letter-spacing: .55px !important;

    text-align: left !important;
    text-transform: uppercase !important;

    white-space: nowrap !important;
}


body.page-id-1180
#booknetic_customer_panel_packages_table tbody tr {
    background: transparent !important;

    border: 0 !important;
    border-bottom: 1px solid #292929 !important;

    transition: background-color .18s ease !important;
}


body.page-id-1180
#booknetic_customer_panel_packages_table tbody tr:hover {
    background: linear-gradient(
        90deg,
        rgba(255,255,255,.035) 0%,
        rgba(255,255,255,.018) 58%,
        rgba(255,255,255,0) 100%
    ) !important;
}


body.page-id-1180
#booknetic_customer_panel_packages_table tbody td {
    min-height: 54px !important;

    padding: 12px 8px !important;

    background: transparent !important;

    color: #D0D0D0 !important;

    border: 0 !important;

    font-size: 10px !important;
    font-weight: 400 !important;
    line-height: 16px !important;

    vertical-align: middle !important;
}


/* Package ID — deliberately quiet */
body.page-id-1180
#booknetic_customer_panel_packages_table tbody td:first-child {
    color: #5E5E5E !important;

    font-size: 9px !important;
}


/* Package name — strongest information in each row */
body.page-id-1180
#booknetic_customer_panel_packages_table tbody td:nth-child(2) {
    color: #FFFFFF !important;

    font-weight: 600 !important;
}


/* Package price */
body.page-id-1180
#booknetic_customer_panel_packages_table tbody td:nth-child(3) {
    color: #FFD700 !important;

    font-weight: 600 !important;

    white-space: nowrap !important;
}


/* Created date */
body.page-id-1180
#booknetic_customer_panel_packages_table tbody td:nth-child(5) {
    color: #C8C8C8 !important;

    white-space: nowrap !important;
}


/* Keep package progress text crisp */
body.page-id-1180
#booknetic_customer_panel_packages_table tbody td:nth-child(4) {
    color: #D8D8D8 !important;

    font-weight: 500 !important;
}


/* Package usage/progress bars — remove Booknetic green */
body.page-id-1180
#booknetic_customer_panel_packages_table progress,
body.page-id-1180
#booknetic_customer_panel_packages_table [class*="progress"],
body.page-id-1180
#booknetic_customer_panel_packages_table [class*="Progress"] {
    accent-color: #FFD700 !important;
}


body.page-id-1180
#booknetic_customer_panel_packages_table progress::-webkit-progress-bar {
    background: #171717 !important;
    border-radius: 20px !important;
}


body.page-id-1180
#booknetic_customer_panel_packages_table progress::-webkit-progress-value {
    background: linear-gradient(90deg, #C9A94B 0%, #FFD700 100%) !important;
    border-radius: 20px !important;
}


body.page-id-1180
#booknetic_customer_panel_packages_table progress::-moz-progress-bar {
    background: linear-gradient(90deg, #C9A94B 0%, #FFD700 100%) !important;
    border-radius: 20px !important;
}


/* Generic package action buttons: PAY NOW / MANAGE PACKAGE */
body.page-id-1180
#booknetic_customer_panel_packages_table button,
body.page-id-1180
#booknetic_customer_panel_packages_table a[class*="btn"],
body.page-id-1180
#booknetic_customer_panel_packages_table [role="button"] {
    min-width: 104px !important;
    min-height: 30px !important;

    padding: 0 12px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;

    background: linear-gradient(180deg, #141414 0%, #080808 100%) !important;

    color: #FFD700 !important;

    border: 1px solid rgba(255,215,0,.62) !important;
    border-radius: 2px !important;

    box-shadow: inset 0 0 0 1px rgba(255,255,255,.015) !important;

    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 8px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: .3px !important;

    text-decoration: none !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;

    cursor: pointer !important;

    transition:
        background .18s ease,
        color .18s ease,
        border-color .18s ease,
        transform .18s ease,
        box-shadow .18s ease !important;
}


body.page-id-1180
#booknetic_customer_panel_packages_table button:hover,
body.page-id-1180
#booknetic_customer_panel_packages_table a[class*="btn"]:hover,
body.page-id-1180
#booknetic_customer_panel_packages_table [role="button"]:hover {
    background: linear-gradient(180deg, #FFE348 0%, #FFD700 100%) !important;

    color: #000000 !important;

    border-color: #FFD700 !important;

    transform: translateY(-1px) !important;

    box-shadow:
        0 5px 14px rgba(0,0,0,.35),
        0 0 10px rgba(255,215,0,.10) !important;
}


body.page-id-1180
#booknetic_customer_panel_packages_table button i,
body.page-id-1180
#booknetic_customer_panel_packages_table button svg,
body.page-id-1180
#booknetic_customer_panel_packages_table a[class*="btn"] i,
body.page-id-1180
#booknetic_customer_panel_packages_table a[class*="btn"] svg {
    color: currentColor !important;
    fill: currentColor !important;
}


/* If Booknetic exposes a dedicated manage-package class, make it the primary action */
body.page-id-1180
#booknetic_customer_panel_packages_table [class*="manage_package"],
body.page-id-1180
#booknetic_customer_panel_packages_table [class*="manage-package"],
body.page-id-1180
#booknetic_customer_panel_packages_table [class*="package_manage"] {
    background: linear-gradient(180deg, #FFE348 0%, #FFD700 100%) !important;

    color: #000000 !important;

    border-color: #FFD700 !important;

    box-shadow: 0 4px 12px rgba(0,0,0,.28) !important;
}


body.page-id-1180
#booknetic_customer_panel_packages_table [class*="manage_package"]:hover,
body.page-id-1180
#booknetic_customer_panel_packages_table [class*="manage-package"]:hover,
body.page-id-1180
#booknetic_customer_panel_packages_table [class*="package_manage"]:hover {
    background: #FFFFFF !important;

    color: #000000 !important;

    border-color: #FFFFFF !important;
}


/* =========================================================
   PACKAGE BOOKING POPUP — CLOSE BUTTON
   Overrides Booknetic's inline white circle.
   ========================================================= */

body.page-id-1180 .booknetic_close_booking_panel {
    position: absolute !important;
    right: -15px !important;
    top: -15px !important;

    width: 32px !important;
    height: 32px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    background: linear-gradient(180deg, #141414 0%, #080808 100%) !important;

    color: #FFD700 !important;

    border: 1px solid #FFD700 !important;
    border-radius: 50% !important;

    box-shadow:
        0 4px 14px rgba(0,0,0,.55),
        0 0 0 1px rgba(255,215,0,.08) !important;

    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 1 !important;

    cursor: pointer !important;

    transition:
        background .2s ease,
        color .2s ease,
        transform .2s ease,
        box-shadow .2s ease !important;

    z-index: 9999 !important;
}


body.page-id-1180 .booknetic_close_booking_panel:hover {
    background: #FFD700 !important;

    color: #000000 !important;

    transform: scale(1.06) !important;

    box-shadow:
        0 5px 18px rgba(0,0,0,.65),
        0 0 12px rgba(255,215,0,.25) !important;
}


}

/* =========================================================
   CUSTOMER ACCOUNT — PACKAGES (EXACT BOOKNETIC SELECTORS)
   ========================================================= */

body.page-id-1180 .booknetic-packages-list .booknetic_elegant_table tbody tr {
    transition: background-color .18s ease !important;
}

body.page-id-1180 .booknetic-packages-list .booknetic_elegant_table tbody tr:hover {
    background: rgba(255,255,255,.018) !important;
}

body.page-id-1180 .booknetic-packages-list .booknetic_elegant_table tbody td:nth-child(2) {
    color: #FFFFFF !important;
    font-weight: 500 !important;
}

body.page-id-1180 .booknetic-packages-list .booknetic_elegant_table tbody td:nth-child(3) {
    color: #FFD700 !important;
    font-weight: 500 !important;
}

body.page-id-1180 .booknetic-packages-list .booknetic_elegant_table tbody td:nth-child(5) {
    color: rgba(255,255,255,.72) !important;
}

body.page-id-1180 .booknetic-package-progressbar {
    height: 3px !important;
    background: rgba(255,255,255,.10) !important;
    border: 0 !important;
    border-radius: 999px !important;
    overflow: hidden !important;
}

body.page-id-1180 .booknetic-package-progressbar > span {
    display: block !important;
    height: 100% !important;
    background: linear-gradient(90deg, #C9A94B 0%, #FFD700 100%) !important;
    border-radius: 999px !important;
    box-shadow: 0 0 7px rgba(255,215,0,.22) !important;
}

body.page-id-1180 .booknetic_pay_package_btn,
body.page-id-1180 .booknetic_manage_package_btn {
    min-width: 112px !important;
    height: 34px !important;
    padding: 0 13px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    border-radius: 2px !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: .25px !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    transition: background .18s ease, color .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease !important;
}

body.page-id-1180 .booknetic_pay_package_btn {
    background: linear-gradient(180deg, #151515 0%, #090909 100%) !important;
    border: 1px solid rgba(255,215,0,.72) !important;
    color: #FFD700 !important;
    box-shadow: inset 0 0 0 1px rgba(255,215,0,.03) !important;
}

body.page-id-1180 .booknetic_pay_package_btn i {
    color: #FFD700 !important;
}

body.page-id-1180 .booknetic_pay_package_btn:hover {
    background: linear-gradient(180deg, #FFE04A 0%, #FFD700 100%) !important;
    border-color: #FFD700 !important;
    color: #050505 !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 5px 14px rgba(0,0,0,.35), 0 0 10px rgba(255,215,0,.14) !important;
}

body.page-id-1180 .booknetic_pay_package_btn:hover i {
    color: #050505 !important;
}

body.page-id-1180 .booknetic_manage_package_btn {
    background: linear-gradient(180deg, #FFE04A 0%, #FFD700 100%) !important;
    border: 1px solid #FFD700 !important;
    color: #050505 !important;
    box-shadow: 0 3px 10px rgba(0,0,0,.28) !important;
}

body.page-id-1180 .booknetic_manage_package_btn i {
    color: #050505 !important;
}

body.page-id-1180 .booknetic_manage_package_btn:hover {
    background: #050505 !important;
    color: #FFD700 !important;
    border-color: #FFD700 !important;
    transform: translateY(-1px) !important;
}

body.page-id-1180 .booknetic_manage_package_btn:hover i {
    color: #FFD700 !important;
}

/* Pay Now popup */
body.page-id-1180 #booknetic_packages_pay_now_popup .booknetic_popup_body {
    background: linear-gradient(180deg, #111111 0%, #080808 100%) !important;
    border: 1px solid rgba(255,215,0,.65) !important;
    color: #FFFFFF !important;
    box-shadow: 0 18px 50px rgba(0,0,0,.65) !important;
}

body.page-id-1180 #booknetic_packages_pay_now_popup label {
    color: #FFFFFF !important;
}

body.page-id-1180 #booknetic_packages_pay_now_popup .form-control {
    background: #0B0B0B !important;
    color: #FFFFFF !important;
    border: 1px solid rgba(255,215,0,.35) !important;
}

body.page-id-1180 .booknetic_pay_now_popup_cancel {
    background: #0A0A0A !important;
    color: #D8D8D8 !important;
    border: 1px solid rgba(255,215,0,.38) !important;
}

body.page-id-1180 .booknetic_packages_pay_now_popup_confirm {
    background: #FFD700 !important;
    color: #050505 !important;
    border: 1px solid #FFD700 !important;
}

/* =========================================================
   MANAGE PACKAGE VIEW
   ========================================================= */

body.page-id-1180 .booknetic-packages-manage-package {
    color: #FFFFFF !important;
}

body.page-id-1180 .booknetic-package-manage-package-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 20px !important;
    padding: 20px 20px 18px !important;
    margin: 0 !important;
    background: linear-gradient(180deg, rgba(18,18,18,.96) 0%, rgba(8,8,8,.96) 100%) !important;
    border-bottom: 1px solid rgba(255,215,0,.30) !important;
    color: #FFFFFF !important;
}

body.page-id-1180 .booknetic-package-manage-package-header > div:last-child {
    min-width: 145px !important;
    color: rgba(255,255,255,.82) !important;
    text-align: right !important;
}

body.page-id-1180 .booknetic-packages-manage-package-backbtn {
    appearance: none !important;
    background: transparent !important;
    border: 0 !important;
    padding: 0 10px 0 0 !important;
    margin: 0 10px 0 0 !important;
    color: #FFD700 !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    border-right: 1px solid rgba(255,255,255,.16) !important;
}

body.page-id-1180 .booknetic-packages-manage-package-backbtn:hover {
    color: #FFFFFF !important;
}

body.page-id-1180 .booknetic-packages-manage-package-name {
    color: #FFFFFF !important;
    font-size: 15px !important;
    font-weight: 500 !important;
}

body.page-id-1180 .booknetic-package-service-container {
    padding: 20px !important;
    background: transparent !important;
}

body.page-id-1180 .booknetic-package-service {
    overflow: hidden !important;
    background: linear-gradient(180deg, #101010 0%, #090909 100%) !important;
    border: 1px solid rgba(255,215,0,.42) !important;
    border-radius: 3px !important;
    box-shadow: 0 10px 28px rgba(0,0,0,.28) !important;
}

body.page-id-1180 .booknetic-package-service-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 20px !important;
    padding: 15px 17px !important;
    margin: 0 !important;
    background: linear-gradient(180deg, #171717 0%, #101010 100%) !important;
    border-bottom: 1px solid rgba(255,215,0,.25) !important;
    color: #FFFFFF !important;
}

body.page-id-1180 .booknetic-package-service-name {
    margin: 0 !important;
    color: #FFFFFF !important;
    font-size: 13px !important;
    font-weight: 600 !important;
}

body.page-id-1180 .booknetic-package-service-category {
    margin: 0 0 0 4px !important;
}

body.page-id-1180 .booknetic-package-service-secondary {
    color: rgba(255,255,255,.62) !important;
    font-size: 11px !important;
}

body.page-id-1180 .booknetic-package-service-header > .booknetic-package-service-secondary {
    color: #FFD700 !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
}

body.page-id-1180 .booknetic-package-service-item-container {
    padding: 12px !important;
    background: #080808 !important;
}

body.page-id-1180 .booknetic-package-service-item.booknetic-package-schedule-now {
    min-height: 48px !important;
    margin: 0 0 9px !important;
    padding: 9px 13px !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    background: linear-gradient(180deg, #141414 0%, #0E0E0E 100%) !important;
    border: 1px solid rgba(255,255,255,.10) !important;
    border-radius: 3px !important;
    color: #FFFFFF !important;
    cursor: pointer !important;
    transition: border-color .18s ease, background .18s ease, transform .18s ease !important;
}

body.page-id-1180 .booknetic-package-service-item.booknetic-package-schedule-now:last-child {
    margin-bottom: 0 !important;
}

body.page-id-1180 .booknetic-package-service-item.booknetic-package-schedule-now:hover {
    background: linear-gradient(180deg, #181818 0%, #101010 100%) !important;
    border-color: rgba(255,215,0,.55) !important;
    transform: translateX(2px) !important;
}

body.page-id-1180 .booknetic-package-service-item.booknetic-package-schedule-now img {
    width: 27px !important;
    height: 27px !important;
    padding: 6px !important;
    box-sizing: border-box !important;
    object-fit: contain !important;
    background: #090909 !important;
    border: 1px solid rgba(255,215,0,.62) !important;
    border-radius: 2px !important;
}

body.page-id-1180 .booknetic-package-service-item.booknetic-package-schedule-now p {
    margin: 0 !important;
    color: #FFFFFF !important;
    font-size: 12px !important;
    font-weight: 500 !important;
}

body.page-id-1180 .booknetic-package-service-item.booknetic-package-schedule-now:hover p {
    color: #FFD700 !important;
}

/* Package booking modal close button */
body.page-id-1180 .booknetic_close_booking_panel {
    position: absolute !important;
    right: -15px !important;
    top: -15px !important;
    width: 32px !important;
    height: 32px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: linear-gradient(180deg, #141414 0%, #080808 100%) !important;
    border: 1px solid #FFD700 !important;
    border-radius: 50% !important;
    color: #FFD700 !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    cursor: pointer !important;
    box-shadow: 0 4px 14px rgba(0,0,0,.55), 0 0 0 1px rgba(255,215,0,.08) !important;
    transition: background .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease !important;
    z-index: 9999 !important;
}

body.page-id-1180 .booknetic_close_booking_panel:hover {
    background: #FFD700 !important;
    color: #000000 !important;
    transform: scale(1.06) !important;
    box-shadow: 0 5px 18px rgba(0,0,0,.65), 0 0 12px rgba(255,215,0,.25) !important;
}

/* =========================================================
   PACKAGES — FINISHING PASS (v6)
   Booked session state + manage header spacing + cursor fix
   ========================================================= */

/* Give the Manage Package header a little more breathing room below the tabs */
body.page-id-1180 .booknetic-package-manage-package-header {
    padding: 17px 20px 16px !important;
    margin: 0 !important;
    min-height: 52px !important;
    box-sizing: border-box !important;
}

body.page-id-1180 .booknetic-package-manage-package-header > div:first-child,
body.page-id-1180 .booknetic-package-manage-package-header > div:last-child {
    display: flex !important;
    align-items: center !important;
}

body.page-id-1180 .booknetic-package-manage-package-header > div:last-child {
    flex-direction: column !important;
    align-items: flex-end !important;
    justify-content: center !important;
    gap: 5px !important;
}

/* Booked / scheduled package session */
body.page-id-1180 .booknetic-package-service-item.booknetic-package-scheduled-service-item {
    position: relative !important;
    min-height: 44px !important;
    margin: 0 0 9px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: stretch !important;
    background: linear-gradient(180deg, #151515 0%, #0C0C0C 100%) !important;
    border: 1px solid rgba(201,169,75,.58) !important;
    border-left: 3px solid #FFD700 !important;
    border-radius: 3px !important;
    box-shadow: inset 0 0 0 1px rgba(255,215,0,.025) !important;
    overflow: hidden !important;
}

body.page-id-1180 .booknetic-package-service-item.booknetic-package-scheduled-service-item:last-child {
    margin-bottom: 0 !important;
}

body.page-id-1180 .booknetic-package-service-item-appointment-info {
    width: 100% !important;
    min-height: 44px !important;
    padding: 10px 13px !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    color: rgba(255,255,255,.72) !important;
    background: transparent !important;
}

body.page-id-1180 .booknetic-package-service-item-appointment-info p {
    margin: 0 !important;
    padding: 0 !important;
    color: rgba(255,255,255,.72) !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    line-height: 1.35 !important;
}

/* Staff name is the primary piece of booked-session information */
body.page-id-1180 .booknetic-package-service-item-appointment-info p:first-child {
    color: #FFFFFF !important;
    font-weight: 600 !important;
}

/* Tiny separators between staff / location / date */
body.page-id-1180 .booknetic-package-disc {
    width: 4px !important;
    height: 4px !important;
    min-width: 4px !important;
    min-height: 4px !important;
    margin: 0 1px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: #FFD700 !important;
    box-shadow: 0 0 5px rgba(255,215,0,.22) !important;
}

/* =========================================================
   PACKAGE BOOKING POPUP — CURSOR FIX
   ========================================================= */

/* Force a visible native cursor over the Booknetic modal and its contents. */
body.page-id-1180 .booknetic_booking_panel,
body.page-id-1180 .booknetic_booking_panel *,
body.page-id-1180 .booknetic_booking_panel_overlay,
body.page-id-1180 .booknetic_booking_panel_overlay *,
body.page-id-1180 .booknetic_appointment_container,
body.page-id-1180 .booknetic_appointment_container *,
body.page-id-1180 .booknetic_appointment_container_body,
body.page-id-1180 .booknetic_appointment_container_body * {
    cursor: default !important;
}

/* Interactive controls keep the expected hand/text cursors. */
body.page-id-1180 .booknetic_booking_panel button,
body.page-id-1180 .booknetic_booking_panel a,
body.page-id-1180 .booknetic_booking_panel [role="button"],
body.page-id-1180 .booknetic_booking_panel .booknetic_card,
body.page-id-1180 .booknetic_booking_panel .booknetic_service_card,
body.page-id-1180 .booknetic_booking_panel .booknetic_staff_card,
body.page-id-1180 .booknetic_booking_panel .booknetic_close_booking_panel,
body.page-id-1180 .booknetic_appointment_container button,
body.page-id-1180 .booknetic_appointment_container a,
body.page-id-1180 .booknetic_appointment_container [role="button"],
body.page-id-1180 .booknetic_appointment_container .booknetic_card,
body.page-id-1180 .booknetic_appointment_container .booknetic_service_card,
body.page-id-1180 .booknetic_appointment_container .booknetic_staff_card,
body.page-id-1180 .booknetic_appointment_container .booknetic_close_booking_panel {
    cursor: pointer !important;
}

body.page-id-1180 .booknetic_booking_panel input,
body.page-id-1180 .booknetic_booking_panel textarea,
body.page-id-1180 .booknetic_appointment_container input,
body.page-id-1180 .booknetic_appointment_container textarea {
    cursor: text !important;
}

body.page-id-1180 .booknetic_booking_panel select,
body.page-id-1180 .booknetic_appointment_container select {
    cursor: pointer !important;
}

/* Keep the close control above every modal layer and explicitly clickable. */
body.page-id-1180 .booknetic_close_booking_panel {
    pointer-events: auto !important;
    cursor: pointer !important;
    z-index: 2147483647 !important;
}


/* =========================================================
   PROFILE TAB — FINISHED DAMIAN PHILPOTT TREATMENT
   Exact Booknetic form selectors supplied from live markup.
   ========================================================= */

/* Give the profile form a little more breathing room without
   altering the customer-panel dimensions or global layout. */
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form {
    width: 100% !important;
    margin: 0 !important;
    padding: 2px 0 0 !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .row {
    margin-left: -8px !important;
    margin-right: -8px !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .col-12,
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .col-lg-6 {
    padding-left: 8px !important;
    padding-right: 8px !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .bookentic-cp-user-form-item {
    margin-bottom: 18px !important;
}

/* Labels */
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .bookentic-cp-form-label {
    display: block !important;
    margin: 0 0 8px !important;
    color: #A2A2A2 !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 9px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    letter-spacing: .72px !important;
    text-transform: uppercase !important;
}

/* Main fields */
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .bookentic-cp-form-control,
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form input[type="text"],
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form input[type="email"],
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form input[type="tel"],
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form select {
    width: 100% !important;
    height: 46px !important;
    min-height: 46px !important;
    padding: 0 13px !important;
    background: linear-gradient(180deg, #151515 0%, #0D0D0D 100%) !important;
    color: #F5F5F5 !important;
    border: 1px solid #363636 !important;
    border-radius: 2px !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.018) !important;
    outline: none !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    line-height: 46px !important;
    box-sizing: border-box !important;
    transition: border-color .18s ease, box-shadow .18s ease, background .18s ease !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .bookentic-cp-form-control:hover,
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form input:hover,
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form select:hover {
    border-color: #4A4A4A !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .bookentic-cp-form-control:focus,
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form input:focus,
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form select:focus {
    background: linear-gradient(180deg, #181818 0%, #101010 100%) !important;
    border-color: #FFD700 !important;
    box-shadow:
        0 0 0 1px rgba(255,215,0,.08),
        0 0 12px rgba(255,215,0,.07) !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form input::placeholder {
    color: #666666 !important;
    opacity: 1 !important;
}

/* DuckDuckGo / browser autofill background icon on email should not
   turn the actual field light. Keep its injected icon but preserve dark UI. */
body.page-id-1180 #booknetic-customer-panel #booknetic_input_email {
    background-color: #111111 !important;
    color: #F5F5F5 !important;
    padding-right: 38px !important;
}

/* Phone field / international telephone input */
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti {
    width: 100% !important;
    display: block !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti input,
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti input[type="tel"] {
    padding-left: 94px !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country-container {
    height: 46px !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__selected-country {
    height: 46px !important;
    min-height: 46px !important;
    padding: 0 10px !important;
    background: transparent !important;
    color: #E9E9E9 !important;
    border: 0 !important;
    border-right: 1px solid #343434 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__selected-dial-code {
    color: #D6D6D6 !important;
    font-size: 11px !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__arrow {
    border-top-color: #FFD700 !important;
}

/* Country dropdown */
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__dropdown-content {
    background: #101010 !important;
    color: #DDDDDD !important;
    border: 1px solid rgba(255,215,0,.32) !important;
    border-radius: 2px !important;
    box-shadow: 0 14px 36px rgba(0,0,0,.72) !important;
    overflow: hidden !important;
    z-index: 99999 !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__search-input-wrapper {
    background: #0B0B0B !important;
    border-bottom: 1px solid #2B2B2B !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__search-input {
    background: #0B0B0B !important;
    color: #FFFFFF !important;
    border: 0 !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country {
    color: #CFCFCF !important;
    background: #101010 !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country:hover,
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country.iti__highlight {
    background: #1A1A1A !important;
    color: #FFD700 !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__dial-code {
    color: #8F8F8F !important;
}

/* Date of birth / Flatpickr field */
body.page-id-1180 #booknetic-customer-panel #bookentic-calendar {
    position: relative !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-calendar input.flatpickr-input:not([type="hidden"]) {
    padding-right: 38px !important;
    cursor: pointer !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-calendar::after {
    content: "\f133" !important;
    position: absolute !important;
    right: 14px !important;
    bottom: 15px !important;
    color: #FFD700 !important;
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", FontAwesome, sans-serif !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    pointer-events: none !important;
    opacity: .88 !important;
}

/* Gender dropdown */
body.page-id-1180 #booknetic-customer-panel #booknetic_input_gender {
    cursor: pointer !important;
    color-scheme: dark !important;
    appearance: auto !important;
}

body.page-id-1180 #booknetic-customer-panel #booknetic_input_gender option {
    background: #111111 !important;
    color: #FFFFFF !important;
}

/* Profile action buttons.
   The class-substring rules make this robust across Booknetic versions. */
body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab-body:has(#bookentic-cp-user-form) button[class*="save" i],
body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab-body:has(#bookentic-cp-user-form) [class*="save" i][role="button"] {
    min-width: 90px !important;
    min-height: 42px !important;
    padding: 0 21px !important;
    background: linear-gradient(180deg, #FFE33A 0%, #FFD700 58%, #D9B900 100%) !important;
    color: #050505 !important;
    border: 1px solid #FFD700 !important;
    border-radius: 2px !important;
    box-shadow: 0 6px 16px rgba(0,0,0,.26) !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    letter-spacing: .55px !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    transition: transform .16s ease, box-shadow .16s ease, background .16s ease !important;
}

body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab-body:has(#bookentic-cp-user-form) button[class*="save" i]:hover,
body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab-body:has(#bookentic-cp-user-form) [class*="save" i][role="button"]:hover {
    background: #000000 !important;
    color: #FFD700 !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 7px 18px rgba(0,0,0,.38), 0 0 0 1px rgba(255,215,0,.15) !important;
}

/* Destructive profile action — deliberately quieter than SAVE */
body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab-body:has(#bookentic-cp-user-form) button[class*="delete" i][class*="profile" i],
body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab-body:has(#bookentic-cp-user-form) [class*="delete" i][class*="profile" i][role="button"] {
    min-height: 42px !important;
    padding: 0 18px !important;
    background: linear-gradient(180deg, #151010 0%, #0B0909 100%) !important;
    color: #C86060 !important;
    border: 1px solid rgba(168,74,74,.82) !important;
    border-radius: 2px !important;
    box-shadow: none !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    letter-spacing: .45px !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    transition: background .16s ease, color .16s ease, border-color .16s ease, transform .16s ease !important;
}

body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab-body:has(#bookentic-cp-user-form) button[class*="delete" i][class*="profile" i]:hover,
body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab-body:has(#bookentic-cp-user-form) [class*="delete" i][class*="profile" i][role="button"]:hover {
    background: #A84A4A !important;
    color: #FFFFFF !important;
    border-color: #A84A4A !important;
    transform: translateY(-1px) !important;
}

/* If Booknetic exposes its usual generic danger class in this tab,
   keep that action in the same restrained destructive treatment. */
body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab-body:has(#bookentic-cp-user-form) .booknetic_btn_danger {
    background: linear-gradient(180deg, #151010 0%, #0B0909 100%) !important;
    color: #C86060 !important;
    border: 1px solid rgba(168,74,74,.82) !important;
    border-radius: 2px !important;
    box-shadow: none !important;
}

body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab-body:has(#bookentic-cp-user-form) .booknetic_btn_danger:hover {
    background: #A84A4A !important;
    color: #FFFFFF !important;
    border-color: #A84A4A !important;
}

/* Focus accessibility */
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form button:focus-visible,
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form input:focus-visible,
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form select:focus-visible {
    outline: 1px solid #FFD700 !important;
    outline-offset: 2px !important;
}

/* =========================================================
   PROFILE TAB — V8 FINAL OVERRIDES
   Phone control, Flatpickr calendar, Save/Delete buttons
   ========================================================= */

/* ---------- PHONE / INTL-TEL-INPUT ---------- */
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti {
    position: relative !important;
    display: block !important;
    width: 100% !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country-container {
    position: absolute !important;
    top: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: auto !important;
    height: 46px !important;
    z-index: 3 !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__selected-country {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 7px !important;
    width: auto !important;
    min-width: 82px !important;
    height: 46px !important;
    min-height: 46px !important;
    padding: 0 10px !important;
    margin: 0 !important;
    background: transparent !important;
    color: #E9E9E9 !important;
    border: 0 !important;
    border-right: 1px solid #343434 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    cursor: pointer !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__selected-country-primary {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 5px !important;
    flex: 0 0 auto !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__selected-dial-code {
    display: block !important;
    position: static !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #D6D6D6 !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    opacity: 1 !important;
    visibility: visible !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__flag {
    flex: 0 0 auto !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__arrow {
    flex: 0 0 auto !important;
    margin-left: 1px !important;
    border-top-color: #FFD700 !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form #booknetic_input_phone,
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti input[type="tel"] {
    width: 100% !important;
    padding-left: 96px !important;
}

/* ---------- FLATPICKR / DATE OF BIRTH CALENDAR ---------- */
body.page-id-1180 .flatpickr-calendar,
body.page-id-1180 .flatpickr-calendar.open {
    background: #0E0E0E !important;
    border: 1px solid rgba(255,215,0,.46) !important;
    border-radius: 3px !important;
    box-shadow: 0 18px 46px rgba(0,0,0,.72), 0 0 0 1px rgba(255,215,0,.06) !important;
    color: #EDEDED !important;
    font-family: Helvetica, Arial, sans-serif !important;
    z-index: 999999 !important;
}

body.page-id-1180 .flatpickr-calendar::before,
body.page-id-1180 .flatpickr-calendar::after {
    border-bottom-color: #0E0E0E !important;
    border-top-color: #0E0E0E !important;
}

body.page-id-1180 .flatpickr-calendar.arrowTop::before {
    border-bottom-color: rgba(255,215,0,.46) !important;
}

body.page-id-1180 .flatpickr-calendar.arrowTop::after {
    border-bottom-color: #0E0E0E !important;
}

body.page-id-1180 .flatpickr-calendar.arrowBottom::before {
    border-top-color: rgba(255,215,0,.46) !important;
}

body.page-id-1180 .flatpickr-calendar.arrowBottom::after {
    border-top-color: #0E0E0E !important;
}

body.page-id-1180 .flatpickr-months,
body.page-id-1180 .flatpickr-month,
body.page-id-1180 .flatpickr-current-month,
body.page-id-1180 .flatpickr-innerContainer,
body.page-id-1180 .flatpickr-rContainer,
body.page-id-1180 .flatpickr-days,
body.page-id-1180 .dayContainer,
body.page-id-1180 .flatpickr-weekdays {
    background: #0E0E0E !important;
}

body.page-id-1180 .flatpickr-months {
    border-bottom: 1px solid #292929 !important;
}

body.page-id-1180 .flatpickr-current-month {
    color: #FFFFFF !important;
    font-size: 100% !important;
}

body.page-id-1180 .flatpickr-current-month .flatpickr-monthDropdown-months,
body.page-id-1180 .flatpickr-current-month input.cur-year {
    background: #0E0E0E !important;
    color: #FFFFFF !important;
    border: 0 !important;
    box-shadow: none !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-weight: 500 !important;
}

body.page-id-1180 .flatpickr-current-month .flatpickr-monthDropdown-months:hover,
body.page-id-1180 .flatpickr-current-month input.cur-year:hover,
body.page-id-1180 .flatpickr-current-month input.cur-year:focus {
    background: #171717 !important;
    color: #FFD700 !important;
}

body.page-id-1180 .flatpickr-monthDropdown-months option {
    background: #111111 !important;
    color: #EDEDED !important;
}

body.page-id-1180 .flatpickr-prev-month,
body.page-id-1180 .flatpickr-next-month {
    color: #FFD700 !important;
    fill: #FFD700 !important;
}

body.page-id-1180 .flatpickr-prev-month svg,
body.page-id-1180 .flatpickr-next-month svg,
body.page-id-1180 .flatpickr-prev-month svg path,
body.page-id-1180 .flatpickr-next-month svg path {
    fill: #FFD700 !important;
}

body.page-id-1180 .flatpickr-prev-month:hover svg,
body.page-id-1180 .flatpickr-next-month:hover svg,
body.page-id-1180 .flatpickr-prev-month:hover svg path,
body.page-id-1180 .flatpickr-next-month:hover svg path {
    fill: #FFF06A !important;
}

body.page-id-1180 span.flatpickr-weekday {
    background: #0E0E0E !important;
    color: #777777 !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 10px !important;
    font-weight: 600 !important;
}

body.page-id-1180 .flatpickr-day {
    color: #D7D7D7 !important;
    background: transparent !important;
    border-color: transparent !important;
    border-radius: 2px !important;
}

body.page-id-1180 .flatpickr-day:hover,
body.page-id-1180 .flatpickr-day:focus {
    background: #1B1B1B !important;
    border-color: #303030 !important;
    color: #FFD700 !important;
}

body.page-id-1180 .flatpickr-day.today {
    background: transparent !important;
    border-color: #FFD700 !important;
    color: #FFD700 !important;
}

body.page-id-1180 .flatpickr-day.today:hover,
body.page-id-1180 .flatpickr-day.today:focus {
    background: #FFD700 !important;
    border-color: #FFD700 !important;
    color: #090909 !important;
}

body.page-id-1180 .flatpickr-day.selected,
body.page-id-1180 .flatpickr-day.startRange,
body.page-id-1180 .flatpickr-day.endRange,
body.page-id-1180 .flatpickr-day.selected:hover,
body.page-id-1180 .flatpickr-day.startRange:hover,
body.page-id-1180 .flatpickr-day.endRange:hover {
    background: #FFD700 !important;
    border-color: #FFD700 !important;
    color: #050505 !important;
    font-weight: 700 !important;
}

body.page-id-1180 .flatpickr-day.inRange {
    background: #202020 !important;
    border-color: #202020 !important;
    color: #EAEAEA !important;
    box-shadow: -5px 0 0 #202020, 5px 0 0 #202020 !important;
}

body.page-id-1180 .flatpickr-day.prevMonthDay,
body.page-id-1180 .flatpickr-day.nextMonthDay,
body.page-id-1180 .flatpickr-day.flatpickr-disabled,
body.page-id-1180 .flatpickr-day.flatpickr-disabled:hover {
    color: #494949 !important;
}

body.page-id-1180 .numInputWrapper span.arrowUp::after {
    border-bottom-color: #FFD700 !important;
}

body.page-id-1180 .numInputWrapper span.arrowDown::after {
    border-top-color: #FFD700 !important;
}

body.page-id-1180 .numInputWrapper:hover {
    background: #171717 !important;
}

/* ---------- PROFILE ACTION BUTTONS ---------- */
body.page-id-1180 #booknetic-customer-panel #booknetic_profile_save {
    min-width: 90px !important;
    min-height: 42px !important;
    padding: 0 21px !important;
    background: linear-gradient(135deg, #FFE34D 0%, #FFD700 48%, #D9B600 100%) !important;
    color: #080808 !important;
    border: 1px solid #FFD700 !important;
    border-radius: 2px !important;
    box-shadow: 0 5px 16px rgba(255,215,0,.12) !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    letter-spacing: .55px !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    transition: background .22s ease, color .22s ease, border-color .22s ease, box-shadow .22s ease, transform .22s ease !important;
}

body.page-id-1180 #booknetic-customer-panel #booknetic_profile_save:hover {
    background: linear-gradient(135deg, #FFF06A 0%, #FFE126 50%, #E2BF00 100%) !important;
    color: #050505 !important;
    border-color: #FFE126 !important;
    box-shadow: 0 7px 20px rgba(255,215,0,.20) !important;
    transform: translateY(-1px) !important;
}

body.page-id-1180 #booknetic-customer-panel #booknetic_profile_delete {
    min-height: 42px !important;
    padding: 0 18px !important;
    background: linear-gradient(180deg, #151111 0%, #0C0A0A 100%) !important;
    color: #C96A6A !important;
    border: 1px solid rgba(168,74,74,.72) !important;
    border-radius: 2px !important;
    box-shadow: none !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    letter-spacing: .45px !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    transition: background .22s ease, color .22s ease, border-color .22s ease, box-shadow .22s ease, transform .22s ease !important;
}

body.page-id-1180 #booknetic-customer-panel #booknetic_profile_delete:hover {
    background: #A84A4A !important;
    color: #FFFFFF !important;
    border-color: #A84A4A !important;
    box-shadow: 0 6px 18px rgba(168,74,74,.20) !important;
    transform: translateY(-1px) !important;
}

body.page-id-1180 #booknetic-customer-panel #booknetic_profile_save:focus-visible,
body.page-id-1180 #booknetic-customer-panel #booknetic_profile_delete:focus-visible {
    outline: 1px solid #FFD700 !important;
    outline-offset: 2px !important;
}

/* =========================================================
   PROFILE TAB — V9 PHONE SPACING + COUNTRY DROPDOWN POLISH
   ========================================================= */

/* Give the typed phone number more breathing room after the
   flag / dial-code control and its divider. */
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form #booknetic_input_phone,
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti input[type="tel"] {
    padding-left: 108px !important;
}

/* Country selector dropdown shell */
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__dropdown-content {
    min-width: 310px !important;
    max-width: 380px !important;
    background: #0D0D0D !important;
    color: #E7E7E7 !important;
    border: 1px solid rgba(255,215,0,.42) !important;
    border-radius: 2px !important;
    box-shadow: 0 18px 44px rgba(0,0,0,.78) !important;
    overflow: hidden !important;
    z-index: 99999 !important;
}

/* Search area */
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__search-input-wrapper {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 42px !important;
    padding: 7px 10px !important;
    background: #0A0A0A !important;
    border-bottom: 1px solid #292929 !important;
    box-sizing: border-box !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__search-icon {
    position: absolute !important;
    left: 20px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 14px !important;
    height: 14px !important;
    color: #FFD700 !important;
    opacity: .85 !important;
    pointer-events: none !important;
    z-index: 2 !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__search-icon-svg {
    display: block !important;
    width: 14px !important;
    height: 14px !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.7 !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__search-input {
    display: block !important;
    width: 100% !important;
    height: 30px !important;
    min-height: 30px !important;
    margin: 0 !important;
    padding: 0 34px 0 34px !important;
    background: #131313 !important;
    color: #F2F2F2 !important;
    border: 1px solid #303030 !important;
    border-radius: 2px !important;
    box-shadow: none !important;
    outline: none !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 11px !important;
    line-height: 30px !important;
    box-sizing: border-box !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__search-input::placeholder {
    color: #777777 !important;
    opacity: 1 !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__search-input:focus {
    border-color: rgba(255,215,0,.72) !important;
    box-shadow: 0 0 0 1px rgba(255,215,0,.08) !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__search-clear {
    position: absolute !important;
    right: 18px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    min-height: 18px !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 50% !important;
    box-shadow: none !important;
    cursor: pointer !important;
    z-index: 3 !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__search-clear-bg {
    fill: #FFD700 !important;
}

/* Country list */
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country-list {
    margin: 0 !important;
    padding: 4px 0 !important;
    max-height: 220px !important;
    background: #0D0D0D !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    scrollbar-width: thin !important;
    scrollbar-color: #4A4020 #111111 !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country {
    display: flex !important;
    align-items: center !important;
    gap: 9px !important;
    min-height: 34px !important;
    margin: 0 !important;
    padding: 7px 12px !important;
    background: #0D0D0D !important;
    color: #D9D9D9 !important;
    border: 0 !important;
    box-sizing: border-box !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 11px !important;
    line-height: 1.2 !important;
    cursor: pointer !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country + .iti__country {
    border-top: 1px solid rgba(255,255,255,.035) !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country:hover,
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country.iti__highlight {
    background: #191919 !important;
    color: #FFFFFF !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country.iti__highlight {
    box-shadow: inset 2px 0 0 #FFD700 !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country-name {
    display: block !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    color: inherit !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__dial-code {
    flex: 0 0 auto !important;
    margin-left: auto !important;
    color: #8F8F8F !important;
    font-size: 10px !important;
    white-space: nowrap !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country:hover .iti__dial-code,
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country.iti__highlight .iti__dial-code {
    color: #C7AD3C !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country .iti__flag-box,
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country .iti__flag {
    flex: 0 0 auto !important;
    margin: 0 !important;
}

/* Keep the dropdown above the rest of the form while it is open. */
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti,
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country-container {
    overflow: visible !important;
}

/* =========================================================
   PROFILE TAB — V10 COUNTRY PICKER REFINEMENT
   ========================================================= */

/* Cleaner, tighter dropdown card */
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__dropdown-content {
    width: 330px !important;
    min-width: 330px !important;
    max-width: 330px !important;
    background: #0B0B0B !important;
    border: 1px solid #2A2A2A !important;
    border-top: 1px solid rgba(255,215,0,.72) !important;
    border-radius: 0 !important;
    box-shadow: 0 16px 38px rgba(0,0,0,.72) !important;
}

/* Search header: one clean surface, not a box inside a box */
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__search-input-wrapper {
    min-height: 46px !important;
    padding: 8px 10px !important;
    background: #101010 !important;
    border-bottom: 1px solid #262626 !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__search-input {
    height: 30px !important;
    min-height: 30px !important;
    padding: 0 32px 0 34px !important;
    background: #101010 !important;
    color: #F2F2F2 !important;
    border: 0 !important;
    border-bottom: 1px solid #343434 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    font-size: 11px !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__search-input:focus {
    border-bottom-color: #FFD700 !important;
    box-shadow: none !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__search-icon {
    left: 15px !important;
    color: #8C8C8C !important;
    opacity: 1 !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__search-input:focus ~ .iti__search-icon,
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__search-input-wrapper:focus-within .iti__search-icon {
    color: #FFD700 !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__search-clear {
    right: 12px !important;
}

/* Country list spacing */
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country-list {
    padding: 3px 0 !important;
    max-height: 224px !important;
    background: #0B0B0B !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    min-height: 38px !important;
    padding: 0 14px !important;
    background: transparent !important;
    color: #CFCFCF !important;
    border: 0 !important;
    box-shadow: none !important;
    font-size: 11px !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country + .iti__country {
    border-top: 1px solid rgba(255,255,255,.045) !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country:hover,
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country.iti__highlight {
    background: #151515 !important;
    color: #FFFFFF !important;
    box-shadow: inset 2px 0 0 rgba(255,215,0,.72) !important;
}

/* Country name and dial code live inside the same span in this ITI version */
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country-name {
    display: block !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    padding-right: 28px !important;
    color: inherit !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__dial-code {
    display: inline !important;
    margin-left: 5px !important;
    color: #777777 !important;
    font-size: 10px !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country:hover .iti__dial-code,
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country.iti__highlight .iti__dial-code,
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country[aria-selected="true"] .iti__dial-code {
    color: #BCA53C !important;
}

/* Replace ITI's dark selected marker with a deliberate gold tick */
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country::after {
    content: none !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country[aria-selected="true"] {
    background: linear-gradient(90deg, rgba(255,215,0,.08) 0%, rgba(255,215,0,.025) 100%) !important;
    color: #FFFFFF !important;
    box-shadow: inset 2px 0 0 #FFD700 !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country[aria-selected="true"]::after {
    content: "✓" !important;
    display: block !important;
    position: absolute !important;
    right: 13px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    color: #FFD700 !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}

/* Keep flags crisp and consistently aligned */
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country > .iti__flag {
    flex: 0 0 auto !important;
    margin: 0 !important;
}

/* Phone field final spacing */
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form #booknetic_input_phone,
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti input[type="tel"] {
    padding-left: 112px !important;
}

/* =========================================================
   PROFILE TAB — V11 ITI ICON / LIST CLEANUP
   Removes theme bullets and restores proper search / clear icons.
   ========================================================= */

/* WordPress/theme list markers must never leak into the ITI country list. */
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country-list,
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country-list li,
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country {
    list-style: none !important;
    list-style-type: none !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country::before,
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country-list li::before {
    content: none !important;
    display: none !important;
}

/* Search icon: force the supplied SVG to render as a magnifying glass,
   not as a filled theme dot. */
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__search-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 14px !important;
    height: 14px !important;
    color: #858585 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__search-icon::before,
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__search-icon::after {
    content: none !important;
    display: none !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__search-icon-svg {
    display: block !important;
    width: 14px !important;
    height: 14px !important;
    overflow: visible !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 2 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__search-icon-svg circle,
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__search-icon-svg line {
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 2 !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__search-input-wrapper:focus-within .iti__search-icon {
    color: #FFD700 !important;
}

/* Clear-search control: remove global button styling and render the
   plugin's SVG as a restrained X instead of a yellow disc. */
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form button.iti__search-clear {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 22px !important;
    min-width: 22px !important;
    height: 22px !important;
    min-height: 22px !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    transform: none !important;
    color: #777777 !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form button.iti__search-clear::before,
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form button.iti__search-clear::after {
    content: none !important;
    display: none !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form button.iti__search-clear:hover {
    background: transparent !important;
    color: #FFD700 !important;
    box-shadow: none !important;
    transform: none !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__search-clear-svg {
    display: block !important;
    width: 12px !important;
    height: 12px !important;
    overflow: visible !important;
}

/* The ITI clear icon uses a mask; keep its circle neutral rather than gold. */
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__search-clear-bg {
    fill: currentColor !important;
}

/* Preserve the plugin's hidden state. */
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__search-clear.iti__hide {
    display: none !important;
}

/* =========================================================
   PROFILE TAB — V12 DATE ICON REFINEMENT
   Replaces the Font Awesome glyph with a crisp custom calendar icon.
   ========================================================= */
body.page-id-1180 #booknetic-customer-panel #bookentic-calendar::after {
    content: "" !important;
    position: absolute !important;
    right: 14px !important;
    bottom: 13px !important;
    width: 15px !important;
    height: 15px !important;
    color: transparent !important;
    font-family: initial !important;
    font-size: 0 !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    pointer-events: none !important;
    opacity: .92 !important;
    background-color: transparent !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 15px 15px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 15 15' fill='none'%3E%3Crect x='2' y='3.25' width='11' height='9.5' rx='1' stroke='%23FFD700' stroke-width='1.2'/%3E%3Cpath d='M4.5 1.75V4.5M10.5 1.75V4.5M2 6H13' stroke='%23FFD700' stroke-width='1.2' stroke-linecap='round'/%3E%3C/svg%3E") !important;
    border: 0 !important;
    box-shadow: none !important;
    transform: none !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-calendar:hover::after,
body.page-id-1180 #booknetic-customer-panel #bookentic-calendar:focus-within::after {
    opacity: 1 !important;
}

/* =========================================================
   PROFILE TAB — V13 FINAL ICON / COUNTRY TICK REFINEMENT
   Uses Booknetic's own calendar.svg from the plugin assets.
   ========================================================= */

/* Use the native Booknetic calendar asset rather than an embedded SVG. */
body.page-id-1180 #booknetic-customer-panel #bookentic-calendar::after {
    content: "" !important;
    position: absolute !important;
    right: 14px !important;
    bottom: 13px !important;
    width: 15px !important;
    height: 15px !important;
    pointer-events: none !important;
    opacity: .92 !important;
    background-color: transparent !important;
    background-image: url("https://damianphilpott.com/wp-content/plugins/booknetic/app/Frontend/assets/icons/calendar.svg") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 15px 15px !important;
    border: 0 !important;
    box-shadow: none !important;
    transform: none !important;
    font-size: 0 !important;
}

body.page-id-1180 #booknetic-customer-panel #bookentic-calendar:hover::after,
body.page-id-1180 #booknetic-customer-panel #bookentic-calendar:focus-within::after {
    opacity: 1 !important;
}

/* Bring the selected-country tick inward so it belongs visually to the row. */
body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__country[aria-selected="true"]::after {
    right: 24px !important;
}

/* =========================================================
   CHANGE PASSWORD — BUTTON HOVER
   Exact button: #booknetic_change_password_save
   ========================================================= */

body.page-id-1180 #booknetic_change_password_save {
    background: #FFD700 !important;
    color: #000000 !important;
    border: 1px solid #FFD700 !important;
    box-shadow: none !important;
    transition:
        background-color .20s ease,
        color .20s ease,
        border-color .20s ease !important;
}

body.page-id-1180 #booknetic_change_password_save:hover,
body.page-id-1180 #booknetic_change_password_save:focus {
    background: #080808 !important;
    color: #FFD700 !important;
    border-color: #FFD700 !important;
    box-shadow: none !important;
    outline: none !important;
}

body.page-id-1180 #booknetic_change_password_save:active {
    background: #111111 !important;
    color: #FFD700 !important;
    border-color: #FFD700 !important;
}

/* =========================================================
   CHANGE PASSWORD — V15 GOLD GRADIENT / DARK HOVER
   ========================================================= */
body.page-id-1180 #booknetic_change_password_save.booknetic-profile-save {
    background: linear-gradient(180deg, #FFE66A 0%, #FFD700 50%, #E6B800 100%) !important;
    color: #000000 !important;
    border: 1px solid #FFD700 !important;
    box-shadow:
        0 4px 14px rgba(255, 215, 0, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.25) !important;
    transition:
        background .25s ease,
        color .25s ease,
        border-color .25s ease,
        box-shadow .25s ease,
        transform .20s ease !important;
}

body.page-id-1180 #booknetic_change_password_save.booknetic-profile-save:hover,
body.page-id-1180 #booknetic_change_password_save.booknetic-profile-save:focus {
    background: linear-gradient(180deg, #1A1A1A 0%, #0D0D0D 48%, #000000 100%) !important;
    color: #FFD700 !important;
    border-color: #FFD700 !important;
    box-shadow:
        0 0 0 1px rgba(255, 215, 0, 0.15),
        0 5px 18px rgba(255, 215, 0, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
    outline: none !important;
    transform: translateY(-1px) !important;
}

body.page-id-1180 #booknetic_change_password_save.booknetic-profile-save:active {
    background: linear-gradient(180deg, #141414 0%, #080808 100%) !important;
    color: #FFD700 !important;
    border-color: #FFD700 !important;
    transform: translateY(0) !important;
}

/* =========================================================
   EMAIL PREFERENCES — TABLE + TOGGLES + SAVE BUTTON
   Damian Philpott black / gold treatment
   ========================================================= */

body.page-id-1180 #booknetic-tab-email-preferences .fs_data_table_wrapper {
    width: 100% !important;
    overflow: visible !important;
    background: transparent !important;
}

body.page-id-1180 #booknetic-tab-email-preferences table,
body.page-id-1180 #booknetic-tab-email-preferences .table-gray-2 {
    width: 100% !important;
    border-collapse: collapse !important;
    background: transparent !important;
    color: #FFFFFF !important;
}

body.page-id-1180 #booknetic-tab-email-preferences thead th {
    padding: 10px 14px !important;
    background: transparent !important;
    color: #7F7F7F !important;
    border: 0 !important;
    border-bottom: 1px solid #242424 !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    letter-spacing: 1.2px !important;
    text-transform: uppercase !important;
}

body.page-id-1180 #booknetic-tab-email-preferences tbody td {
    padding: 12px 14px !important;
    background: transparent !important;
    color: #D8D8D8 !important;
    border: 0 !important;
    border-bottom: 1px solid #242424 !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 13px !important;
    line-height: 1.25 !important;
}

body.page-id-1180 #booknetic-tab-email-preferences tbody tr:hover td {
    background: rgba(255,215,0,.025) !important;
}

body.page-id-1180 #booknetic-tab-email-preferences .booknetic_ep_switch_col {
    width: 120px !important;
    text-align: center !important;
}

/* Toggle shell */
body.page-id-1180 #booknetic-tab-email-preferences .fs_onoffswitch {
    position: relative !important;
    width: 42px !important;
    height: 22px !important;
    margin: 0 auto !important;
}

body.page-id-1180 #booknetic-tab-email-preferences .fs_onoffswitch-checkbox {
    position: absolute !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

body.page-id-1180 #booknetic-tab-email-preferences .fs_onoffswitch-label {
    position: relative !important;
    display: block !important;
    width: 42px !important;
    height: 22px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    cursor: pointer !important;

    background: linear-gradient(180deg, #1A1A1A 0%, #090909 100%) !important;
    border: 1px solid #3A3A3A !important;
    border-radius: 999px !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;

    transition:
        background .20s ease,
        border-color .20s ease,
        box-shadow .20s ease !important;
}

body.page-id-1180 #booknetic-tab-email-preferences .fs_onoffswitch-label::before {
    content: "" !important;
    position: absolute !important;
    top: 3px !important;
    left: 3px !important;
    width: 14px !important;
    height: 14px !important;

    background: #777777 !important;
    border: 0 !important;
    border-radius: 50% !important;
    box-shadow: none !important;

    transition:
        transform .20s ease,
        background .20s ease !important;
}

/* ON state */
body.page-id-1180 #booknetic-tab-email-preferences .fs_onoffswitch-checkbox:checked + .fs_onoffswitch-label {
    background: linear-gradient(
        180deg,
        #FFE66A 0%,
        #FFD700 52%,
        #E6B800 100%
    ) !important;
    border-color: #FFD700 !important;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.28),
        0 0 0 1px rgba(255,215,0,.06) !important;
}

body.page-id-1180 #booknetic-tab-email-preferences .fs_onoffswitch-checkbox:checked + .fs_onoffswitch-label::before {
    transform: translateX(20px) !important;
    background: #000000 !important;
}

/* Keyboard focus */
body.page-id-1180 #booknetic-tab-email-preferences .fs_onoffswitch-checkbox:focus + .fs_onoffswitch-label {
    border-color: #FFD700 !important;
    box-shadow: 0 0 0 2px rgba(255,215,0,.12) !important;
}

/* Email Preferences SAVE button */
body.page-id-1180 #booknetic-tab-email-preferences .booknetic-profile-save,
body.page-id-1180 #booknetic-tab-email-preferences button[type="button"].booknetic-profile-save {
    background: linear-gradient(
        180deg,
        #FFE66A 0%,
        #FFD700 50%,
        #E6B800 100%
    ) !important;
    color: #000000 !important;
    border: 1px solid #FFD700 !important;
    box-shadow:
        0 4px 14px rgba(255,215,0,.10),
        inset 0 1px 0 rgba(255,255,255,.24) !important;

    transition:
        background .25s ease,
        color .25s ease,
        border-color .25s ease,
        box-shadow .25s ease,
        transform .20s ease !important;
}

body.page-id-1180 #booknetic-tab-email-preferences .booknetic-profile-save:hover,
body.page-id-1180 #booknetic-tab-email-preferences .booknetic-profile-save:focus {
    background: linear-gradient(
        180deg,
        #1A1A1A 0%,
        #0D0D0D 48%,
        #000000 100%
    ) !important;
    color: #FFD700 !important;
    border-color: #FFD700 !important;
    box-shadow:
        0 0 0 1px rgba(255,215,0,.12),
        inset 0 1px 0 rgba(255,255,255,.05) !important;
    outline: none !important;
    transform: translateY(-1px) !important;
}

body.page-id-1180 #booknetic-tab-email-preferences .booknetic-profile-save:active {
    transform: translateY(0) !important;
}

@media only screen and (max-width: 767px) {
    body.page-id-1180 #booknetic-tab-email-preferences thead th,
    body.page-id-1180 #booknetic-tab-email-preferences tbody td {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    body.page-id-1180 #booknetic-tab-email-preferences .booknetic_ep_switch_col {
        width: 84px !important;
    }
}

/* =========================================================
   EMAIL PREFERENCES — FINAL PANEL CONCEPT
   Panel-only refinement. Leaves the Customer Account page,
   background, header, tabs and outer layout untouched.
   ========================================================= */

/* Intro block */
body.page-id-1180 #booknetic-tab-email-preferences .booknetic-cp-tab-body::before {
    content: "STAY IN CONTROL\A Choose which emails you would like to receive from Damian Philpott." !important;
    white-space: pre-line !important;
    display: block !important;

    margin: 0 0 20px !important;
    padding: 0 0 16px !important;

    color: #8F8F8F !important;
    border-bottom: 1px solid #242424 !important;

    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1.55 !important;
    letter-spacing: 0 !important;
}

/* Gold intro heading */
body.page-id-1180 #booknetic-tab-email-preferences .booknetic-cp-tab-body::first-line {
    color: #FFD700 !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    letter-spacing: 1.8px !important;
}

/* Table header wording: WORKFLOW -> NOTIFICATION */
body.page-id-1180 #booknetic-tab-email-preferences thead th:first-child {
    font-size: 0 !important;
}

body.page-id-1180 #booknetic-tab-email-preferences thead th:first-child::after {
    content: "NOTIFICATION" !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    letter-spacing: 1.5px !important;
    color: #8A8A8A !important;
}

/* Table header wording: SUBSCRIBED -> RECEIVE */
body.page-id-1180 #booknetic-tab-email-preferences thead th.booknetic_ep_switch_col {
    font-size: 0 !important;
}

body.page-id-1180 #booknetic-tab-email-preferences thead th.booknetic_ep_switch_col::after {
    content: "RECEIVE" !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    letter-spacing: 1.5px !important;
    color: #8A8A8A !important;
}

/* Slightly more premium row treatment */
body.page-id-1180 #booknetic-tab-email-preferences tbody tr {
    transition: background-color .18s ease !important;
}

body.page-id-1180 #booknetic-tab-email-preferences tbody tr:hover td {
    background: rgba(255,215,0,.035) !important;
}

body.page-id-1180 #booknetic-tab-email-preferences tbody td:first-child {
    color: #E6E6E6 !important;
    font-weight: 400 !important;
}

/* Refined switch sizing */
body.page-id-1180 #booknetic-tab-email-preferences .fs_onoffswitch {
    width: 40px !important;
    height: 20px !important;
}

body.page-id-1180 #booknetic-tab-email-preferences .fs_onoffswitch-label {
    width: 40px !important;
    height: 20px !important;
    border-radius: 999px !important;
}

body.page-id-1180 #booknetic-tab-email-preferences .fs_onoffswitch-label::before {
    top: 2px !important;
    left: 2px !important;
    width: 14px !important;
    height: 14px !important;
}

body.page-id-1180 #booknetic-tab-email-preferences .fs_onoffswitch-checkbox:checked + .fs_onoffswitch-label::before {
    transform: translateX(20px) !important;
}

/* Save button wording: SAVE -> SAVE PREFERENCES */
body.page-id-1180 #booknetic-tab-email-preferences .booknetic-profile-save {
    min-width: 150px !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    font-size: 0 !important;
}

body.page-id-1180 #booknetic-tab-email-preferences .booknetic-profile-save::after {
    content: "SAVE PREFERENCES" !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: .4px !important;
    color: inherit !important;
}

/* Small reassurance beneath the button without changing Booknetic markup */
body.page-id-1180 #booknetic-tab-email-preferences .fs_data_table_wrapper::after {
    content: "You can update your email preferences at any time." !important;
    display: inline-block !important;
    margin: 18px 0 0 16px !important;
    color: #777777 !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 11px !important;
    line-height: 1.45 !important;
    vertical-align: middle !important;
}

@media only screen and (max-width: 767px) {
    body.page-id-1180 #booknetic-tab-email-preferences .booknetic-cp-tab-body::before {
        margin-bottom: 14px !important;
        padding-bottom: 14px !important;
        font-size: 11px !important;
    }

    body.page-id-1180 #booknetic-tab-email-preferences .fs_data_table_wrapper::after {
        display: block !important;
        margin: 12px 0 0 !important;
    }

    body.page-id-1180 #booknetic-tab-email-preferences .booknetic-profile-save {
        min-width: 145px !important;
    }
}

/* =========================================================
   EMAIL PREFERENCES — SAVE BUTTON FIX
   Exact Booknetic button:
   .booknetic-profile-save.booknetic_cp_save_tenant_ep
   ========================================================= */

body.page-id-1180 .booknetic-profile-save.booknetic_cp_save_tenant_ep {
    min-width: 150px !important;
    height: 46px !important;
    padding: 0 22px !important;

    background: linear-gradient(135deg, #FFE45C 0%, #FFD700 45%, #E6B800 100%) !important;
    border: 1px solid #FFD700 !important;
    border-radius: 0 !important;

    color: #090909 !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 44px !important;
    letter-spacing: .45px !important;
    text-indent: 0 !important;

    box-shadow: 0 5px 16px rgba(255,215,0,.10) !important;
    cursor: pointer !important;
    transition: background .18s ease, color .18s ease,
                border-color .18s ease, box-shadow .18s ease,
                transform .18s ease !important;
}

/* Remove the previous generated replacement text */
body.page-id-1180 .booknetic-profile-save.booknetic_cp_save_tenant_ep::before,
body.page-id-1180 .booknetic-profile-save.booknetic_cp_save_tenant_ep::after {
    content: none !important;
    display: none !important;
}

body.page-id-1180 .booknetic-profile-save.booknetic_cp_save_tenant_ep:hover,
body.page-id-1180 .booknetic-profile-save.booknetic_cp_save_tenant_ep:focus {
    background: linear-gradient(135deg, #111111 0%, #080808 55%, #000000 100%) !important;
    border-color: #FFD700 !important;
    color: #FFD700 !important;
    box-shadow: 0 0 0 1px rgba(255,215,0,.12),
                0 7px 20px rgba(0,0,0,.35) !important;
    transform: translateY(-1px) !important;
    outline: none !important;
}

body.page-id-1180 .booknetic-profile-save.booknetic_cp_save_tenant_ep:active {
    transform: translateY(0) !important;
}

/* =========================================================
   EMAIL PREFERENCES — CONCEPT TOGGLES
   Dark glass / gold gradient switches matching the approved
   concept. Panel only; Customer Account layout untouched.
   ========================================================= */

/* Table rows */
body.page-id-1180 #booknetic-tab-email-preferences .fs_data_table_wrapper {
    width: 100% !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.page-id-1180 #booknetic-tab-email-preferences .fs_data_table_wrapper table {
    width: 100% !important;
    border-collapse: collapse !important;
    background: transparent !important;
    border: 0 !important;
}

body.page-id-1180 #booknetic-tab-email-preferences .fs_data_table_wrapper tbody tr {
    background: transparent !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(255,255,255,.13) !important;
    transition:
        background .20s ease,
        border-color .20s ease !important;
}

body.page-id-1180 #booknetic-tab-email-preferences .fs_data_table_wrapper tbody tr:hover {
    background: linear-gradient(
        90deg,
        rgba(255,215,0,.02) 0%,
        rgba(255,215,0,.055) 55%,
        rgba(255,215,0,.02) 100%
    ) !important;
    border-bottom-color: rgba(255,215,0,.28) !important;
}

body.page-id-1180 #booknetic-tab-email-preferences .fs_data_table_wrapper tbody td {
    height: 46px !important;
    padding: 0 14px !important;
    background: transparent !important;
    border: 0 !important;
    color: #E8E8E8 !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 1.3 !important;
    vertical-align: middle !important;
}

body.page-id-1180 #booknetic-tab-email-preferences .booknetic_ep_switch_col {
    width: 92px !important;
    min-width: 92px !important;
    text-align: right !important;
}


/* =========================================================
   SWITCH BASE
   ========================================================= */

body.page-id-1180 #booknetic-tab-email-preferences .fs_onoffswitch {
    position: relative !important;
    display: inline-block !important;
    width: 52px !important;
    height: 26px !important;
    margin: 0 !important;
    padding: 0 !important;
    vertical-align: middle !important;
}

body.page-id-1180 #booknetic-tab-email-preferences .fs_onoffswitch-checkbox {
    position: absolute !important;
    opacity: 0 !important;
    pointer-events: none !important;
}


/* OFF track */
body.page-id-1180 #booknetic-tab-email-preferences .fs_onoffswitch-label {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    width: 52px !important;
    height: 26px !important;
    margin: 0 !important;
    padding: 0 !important;
    cursor: pointer !important;
    overflow: hidden !important;

    border: 1px solid #444444 !important;
    border-radius: 999px !important;

    background: linear-gradient(
        180deg,
        #2B2B2B 0%,
        #1A1A1A 48%,
        #101010 100%
    ) !important;

    box-shadow:
        inset 0 1px 1px rgba(255,255,255,.07),
        inset 0 -1px 2px rgba(0,0,0,.75),
        0 1px 2px rgba(0,0,0,.55) !important;

    transition:
        background .24s ease,
        border-color .24s ease,
        box-shadow .24s ease !important;
}

/* remove earlier switch pseudo artwork */
body.page-id-1180 #booknetic-tab-email-preferences .fs_onoffswitch-label::before {
    content: none !important;
    display: none !important;
}

/* OFF knob */
body.page-id-1180 #booknetic-tab-email-preferences .fs_onoffswitch-label::after {
    content: "" !important;
    position: absolute !important;
    top: 3px !important;
    left: 3px !important;

    width: 18px !important;
    height: 18px !important;
    border-radius: 50% !important;

    background: linear-gradient(
        145deg,
        #B9B9B9 0%,
        #858585 50%,
        #666666 100%
    ) !important;

    border: 1px solid rgba(255,255,255,.10) !important;

    box-shadow:
        0 1px 3px rgba(0,0,0,.85),
        inset 0 1px 1px rgba(255,255,255,.30) !important;

    transform: translateX(0) !important;

    transition:
        transform .24s ease,
        background .24s ease,
        border-color .24s ease,
        box-shadow .24s ease !important;
}


/* =========================================================
   ON STATE
   Gold glass gradient / white knob
   ========================================================= */

body.page-id-1180 #booknetic-tab-email-preferences
.fs_onoffswitch-checkbox:checked + .fs_onoffswitch-label {
    border-color: #FFD700 !important;

    background: linear-gradient(
        180deg,
        #3A3100 0%,
        #211B00 42%,
        #0D0B00 100%
    ) !important;

    box-shadow:
        inset 0 1px 1px rgba(255,255,255,.13),
        inset 0 -1px 3px rgba(0,0,0,.82),
        0 0 0 1px rgba(255,215,0,.10),
        0 0 7px rgba(255,215,0,.36),
        0 0 14px rgba(255,215,0,.13) !important;
}

body.page-id-1180 #booknetic-tab-email-preferences
.fs_onoffswitch-checkbox:checked + .fs_onoffswitch-label::after {
    transform: translateX(26px) !important;

    background: linear-gradient(
        145deg,
        #FFFFFF 0%,
        #F5F5F5 45%,
        #D0D0D0 100%
    ) !important;

    border-color: rgba(255,255,255,.65) !important;

    box-shadow:
        0 1px 4px rgba(0,0,0,.85),
        0 0 5px rgba(255,255,255,.24),
        inset 0 1px 1px rgba(255,255,255,.95) !important;
}


/* Hover / focus */
body.page-id-1180 #booknetic-tab-email-preferences
.fs_onoffswitch:hover .fs_onoffswitch-label {
    border-color: rgba(255,215,0,.62) !important;
}

body.page-id-1180 #booknetic-tab-email-preferences
.fs_onoffswitch-checkbox:checked + .fs_onoffswitch-label:hover {
    border-color: #FFE34A !important;

    box-shadow:
        inset 0 1px 1px rgba(255,255,255,.14),
        inset 0 -1px 3px rgba(0,0,0,.82),
        0 0 0 1px rgba(255,215,0,.16),
        0 0 10px rgba(255,215,0,.47),
        0 0 18px rgba(255,215,0,.16) !important;
}

body.page-id-1180 #booknetic-tab-email-preferences
.fs_onoffswitch-checkbox:focus + .fs_onoffswitch-label {
    outline: none !important;
    border-color: #FFD700 !important;
    box-shadow:
        0 0 0 2px rgba(255,215,0,.15),
        0 0 9px rgba(255,215,0,.25) !important;
}


/* =========================================================
   SAVE BUTTON — keep v18 exact button fix
   ========================================================= */

body.page-id-1180 .booknetic-profile-save.booknetic_cp_save_tenant_ep {
    min-width: 150px !important;
    height: 46px !important;
    padding: 0 22px !important;

    background: linear-gradient(
        180deg,
        #FFE85A 0%,
        #FFD700 46%,
        #E6B800 100%
    ) !important;

    border: 1px solid #FFD700 !important;
    border-radius: 0 !important;

    color: #080808 !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 44px !important;
    letter-spacing: .45px !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.38),
        0 4px 14px rgba(255,215,0,.10) !important;

    transition:
        background .22s ease,
        color .22s ease,
        border-color .22s ease,
        box-shadow .22s ease,
        transform .20s ease !important;
}

body.page-id-1180 .booknetic-profile-save.booknetic_cp_save_tenant_ep:hover,
body.page-id-1180 .booknetic-profile-save.booknetic_cp_save_tenant_ep:focus {
    background: linear-gradient(
        180deg,
        #181818 0%,
        #0C0C0C 52%,
        #000000 100%
    ) !important;

    color: #FFD700 !important;
    border-color: #FFD700 !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.05),
        0 0 10px rgba(255,215,0,.16) !important;

    transform: translateY(-1px) !important;
    outline: none !important;
}

body.page-id-1180 .booknetic-profile-save.booknetic_cp_save_tenant_ep:active {
    transform: translateY(0) !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media only screen and (max-width: 767px) {
    body.page-id-1180 #booknetic-tab-email-preferences .fs_data_table_wrapper tbody td {
        height: 44px !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
        font-size: 12px !important;
    }

    body.page-id-1180 #booknetic-tab-email-preferences .booknetic_ep_switch_col {
        width: 72px !important;
        min-width: 72px !important;
    }

    body.page-id-1180 #booknetic-tab-email-preferences .fs_onoffswitch {
        width: 48px !important;
        height: 24px !important;
    }

    body.page-id-1180 #booknetic-tab-email-preferences .fs_onoffswitch-label {
        width: 48px !important;
        height: 24px !important;
    }

    body.page-id-1180 #booknetic-tab-email-preferences .fs_onoffswitch-label::after {
        top: 3px !important;
        left: 3px !important;
        width: 16px !important;
        height: 16px !important;
    }

    body.page-id-1180 #booknetic-tab-email-preferences
    .fs_onoffswitch-checkbox:checked + .fs_onoffswitch-label::after {
        transform: translateX(24px) !important;
    }
}

/* =========================================================
   EMAIL PREFERENCES — CHECK / UNCHECK ALL
   Booknetic Email Preferences uses #booknetic_toggle_all_link.
   Keep the native behaviour; only restore and style the link.
   ========================================================= */

body.page-id-1180 #booknetic-tab-email-preferences #booknetic_toggle_all_link {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    align-items: center !important;
    justify-content: center !important;

    margin: 0 !important;
    padding: 3px 0 !important;

    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;

    color: #FFD700 !important;
    -webkit-text-fill-color: #FFD700 !important;

    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
    letter-spacing: .1px !important;

    text-decoration: none !important;
    cursor: pointer !important;

    transition:
        color .18s ease,
        opacity .18s ease !important;
}

body.page-id-1180 #booknetic-tab-email-preferences #booknetic_toggle_all_link:hover,
body.page-id-1180 #booknetic-tab-email-preferences #booknetic_toggle_all_link:focus {
    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;
    text-decoration: none !important;
    outline: none !important;
}

/* The native wrapper sits above the workflow list.
   Move it visually to the lower-right of the preferences panel. */
body.page-id-1180 #booknetic-tab-email-preferences .booknetic_email_preferences_tab {
    position: relative !important;
}

body.page-id-1180 #booknetic-tab-email-preferences
.booknetic_email_preferences_tab > .mb-3:has(#booknetic_toggle_all_link) {
    position: absolute !important;
    right: 22px !important;
    bottom: 26px !important;
    z-index: 5 !important;

    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;

    width: auto !important;
    height: auto !important;

    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;
    border: 0 !important;
}

/* Fallback for browsers where :has() is unavailable:
   ensure the native wrapper itself is not hidden. */
body.page-id-1180 #booknetic-tab-email-preferences .booknetic_email_preferences_tab > .mb-3 {
    visibility: visible !important;
    opacity: 1 !important;
}

/* Leave space for Save + helper copy + Check all / Uncheck all */
body.page-id-1180 #booknetic-tab-email-preferences .booknetic-cp-tab-body {
    padding-bottom: 34px !important;
}

@media only screen and (max-width: 767px) {
    body.page-id-1180 #booknetic-tab-email-preferences
    .booknetic_email_preferences_tab > .mb-3:has(#booknetic_toggle_all_link) {
        right: 14px !important;
        bottom: 20px !important;
    }

    body.page-id-1180 #booknetic-tab-email-preferences #booknetic_toggle_all_link {
        font-size: 10px !important;
    }
}

/* =========================================================
   EMAIL PREFERENCES — FINAL LAYOUT / ACTIONS FIX
   v21
   - Intro spans full width across the top
   - Notification table fills full panel width
   - Native Check all / Uncheck all becomes a styled control
   - SAVE text restored and button styled correctly
   ========================================================= */

/* Force the Email Preferences content back to one full-width flow */
body.page-id-1180 #booknetic-tab-email-preferences,
body.page-id-1180 #booknetic-tab-email-preferences .booknetic-cp-tab-body,
body.page-id-1180 #booknetic-tab-email-preferences .booknetic_email_preferences_tab,
body.page-id-1180 #booknetic-tab-email-preferences .booknetic_workflow_list,
body.page-id-1180 #booknetic-tab-email-preferences .fs_data_table_wrapper {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
}

/* Intro copy across the full top of the panel */
body.page-id-1180 #booknetic-tab-email-preferences .booknetic-cp-tab-body::before {
    content: "STAY IN CONTROL\A Choose which emails you would like to receive from Damian Philpott." !important;
    white-space: pre-line !important;

    display: block !important;
    width: 100% !important;
    max-width: none !important;

    margin: 0 0 18px !important;
    padding: 0 0 16px !important;

    border-bottom: 1px solid #242424 !important;

    color: #9A9A9A !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    line-height: 1.55 !important;
    letter-spacing: 0 !important;

    box-sizing: border-box !important;
}

body.page-id-1180 #booknetic-tab-email-preferences .booknetic-cp-tab-body::first-line {
    color: #FFD700 !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    letter-spacing: 1.8px !important;
}

/* Make the table occupy the space previously lost beside the intro */
body.page-id-1180 #booknetic-tab-email-preferences table.table-gray-2 {
    width: 100% !important;
    max-width: none !important;
    table-layout: fixed !important;
    margin: 0 !important;
}

body.page-id-1180 #booknetic-tab-email-preferences table.table-gray-2 thead th:first-child,
body.page-id-1180 #booknetic-tab-email-preferences table.table-gray-2 tbody td:first-child {
    width: auto !important;
    text-align: left !important;
}

body.page-id-1180 #booknetic-tab-email-preferences table.table-gray-2 thead th.booknetic_ep_switch_col,
body.page-id-1180 #booknetic-tab-email-preferences table.table-gray-2 tbody td.booknetic_ep_switch_col {
    width: 92px !important;
    min-width: 92px !important;
    text-align: right !important;
}


/* =========================================================
   CHECK ALL / UNCHECK ALL
   Keep Booknetic's native dynamic text + behaviour.
   ========================================================= */

body.page-id-1180 #booknetic-tab-email-preferences .booknetic_email_preferences_tab {
    position: relative !important;
    padding-bottom: 72px !important;
}

/* Native wrapper: place lower-right */
body.page-id-1180 #booknetic-tab-email-preferences
.booknetic_email_preferences_tab > .mb-3 {
    position: absolute !important;
    right: 0 !important;
    bottom: 10px !important;

    display: block !important;
    width: auto !important;
    height: auto !important;

    margin: 0 !important;
    padding: 0 !important;

    visibility: visible !important;
    opacity: 1 !important;
    z-index: 5 !important;
}

/* Styled compact outline control */
body.page-id-1180 #booknetic-tab-email-preferences #booknetic_toggle_all_link {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-width: 88px !important;
    height: 32px !important;
    padding: 0 13px !important;

    background: linear-gradient(
        180deg,
        #161616 0%,
        #080808 100%
    ) !important;

    color: #FFD700 !important;
    -webkit-text-fill-color: #FFD700 !important;

    border: 1px solid rgba(255,215,0,.62) !important;
    border-radius: 2px !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.035),
        0 4px 12px rgba(0,0,0,.22) !important;

    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: .35px !important;
    text-transform: uppercase !important;
    text-decoration: none !important;

    cursor: pointer !important;

    transition:
        background .20s ease,
        color .20s ease,
        border-color .20s ease,
        box-shadow .20s ease,
        transform .20s ease !important;
}

body.page-id-1180 #booknetic-tab-email-preferences #booknetic_toggle_all_link:hover,
body.page-id-1180 #booknetic-tab-email-preferences #booknetic_toggle_all_link:focus {
    background: linear-gradient(
        180deg,
        #FFE65A 0%,
        #FFD700 48%,
        #E6B800 100%
    ) !important;

    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;

    border-color: #FFD700 !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.30),
        0 5px 14px rgba(0,0,0,.28),
        0 0 10px rgba(255,215,0,.12) !important;

    transform: translateY(-1px) !important;
    outline: none !important;
}


/* =========================================================
   SAVE BUTTON — EXACT EMAIL PREFERENCES BUTTON
   Restore real SAVE text hidden by older generic rules.
   ========================================================= */

body.page-id-1180 #booknetic-tab-email-preferences
button.booknetic-profile-save.booknetic_cp_save_tenant_ep {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-width: 154px !important;
    height: 42px !important;
    padding: 0 20px !important;

    margin: 18px 0 0 !important;

    background: linear-gradient(
        180deg,
        #FFE96A 0%,
        #FFD700 48%,
        #E4B700 100%
    ) !important;

    color: #050505 !important;
    -webkit-text-fill-color: #050505 !important;

    border: 1px solid #FFD700 !important;
    border-radius: 2px !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.36),
        0 4px 14px rgba(255,215,0,.10) !important;

    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: .45px !important;
    text-indent: 0 !important;
    text-transform: uppercase !important;

    opacity: 1 !important;
    visibility: visible !important;

    cursor: pointer !important;

    transition:
        background .22s ease,
        color .22s ease,
        border-color .22s ease,
        box-shadow .22s ease,
        transform .20s ease !important;
}

/* Prevent older generated-label rules from blanking the real button */
body.page-id-1180 #booknetic-tab-email-preferences
button.booknetic-profile-save.booknetic_cp_save_tenant_ep::before,
body.page-id-1180 #booknetic-tab-email-preferences
button.booknetic-profile-save.booknetic_cp_save_tenant_ep::after {
    content: none !important;
    display: none !important;
}

body.page-id-1180 #booknetic-tab-email-preferences
button.booknetic-profile-save.booknetic_cp_save_tenant_ep:hover,
body.page-id-1180 #booknetic-tab-email-preferences
button.booknetic-profile-save.booknetic_cp_save_tenant_ep:focus {
    background: linear-gradient(
        180deg,
        #181818 0%,
        #0B0B0B 52%,
        #000000 100%
    ) !important;

    color: #FFD700 !important;
    -webkit-text-fill-color: #FFD700 !important;

    border-color: #FFD700 !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.05),
        0 0 10px rgba(255,215,0,.16) !important;

    transform: translateY(-1px) !important;
    outline: none !important;
}


/* Helper text: keep it full-width beneath the table, not in a side column */
body.page-id-1180 #booknetic-tab-email-preferences .fs_data_table_wrapper::after {
    content: "You can update your email preferences at any time." !important;
    display: block !important;

    width: auto !important;
    margin: 14px 110px 0 0 !important;

    color: #777777 !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 10px !important;
    line-height: 1.45 !important;
}


/* Mobile */
@media only screen and (max-width: 767px) {
    body.page-id-1180 #booknetic-tab-email-preferences .booknetic-cp-tab-body::before {
        margin-bottom: 14px !important;
        padding-bottom: 13px !important;
    }

    body.page-id-1180 #booknetic-tab-email-preferences .booknetic_email_preferences_tab {
        padding-bottom: 66px !important;
    }

    body.page-id-1180 #booknetic-tab-email-preferences
    .booknetic_email_preferences_tab > .mb-3 {
        right: 0 !important;
        bottom: 8px !important;
    }

    body.page-id-1180 #booknetic-tab-email-preferences #booknetic_toggle_all_link {
        min-width: 78px !important;
        height: 30px !important;
        padding: 0 10px !important;
        font-size: 8px !important;
    }

    body.page-id-1180 #booknetic-tab-email-preferences
    button.booknetic-profile-save.booknetic_cp_save_tenant_ep {
        min-width: 140px !important;
        height: 40px !important;
    }

    body.page-id-1180 #booknetic-tab-email-preferences .fs_data_table_wrapper::after {
        margin-right: 0 !important;
        padding-right: 0 !important;
    }
}

/* =========================================================
   CUSTOMER ACCOUNT TABS — EMAIL PREFERENCES VISIBILITY FIX
   v22
   v21 accidentally forced #booknetic-tab-email-preferences
   to display:block, so it appeared underneath other tabs.
   Restore Booknetic's native tab show/hide behaviour.
   ========================================================= */

/* Hidden tabs must remain hidden */
body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab:not(.show) {
    display: none !important;
}

/* Only the active tab is visible */
body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab.show {
    display: block !important;
}

/* Email Preferences itself must NOT be globally forced visible */
body.page-id-1180 #booknetic-tab-email-preferences:not(.show) {
    display: none !important;
}

body.page-id-1180 #booknetic-tab-email-preferences.show {
    display: block !important;
}

/* Keep the Email Preferences INNER layout full width only when active */
body.page-id-1180 #booknetic-tab-email-preferences.show .booknetic-cp-tab-body,
body.page-id-1180 #booknetic-tab-email-preferences.show .booknetic_email_preferences_tab,
body.page-id-1180 #booknetic-tab-email-preferences.show .booknetic_workflow_list,
body.page-id-1180 #booknetic-tab-email-preferences.show .fs_data_table_wrapper {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
}

/* =========================================================
   EMAIL PREFERENCES — CHECK ALL / UNCHECK ALL CONTROL
   v23
   Booknetic does not consistently retain the toggle link ID,
   so target the native link through its wrapper as well.
   ========================================================= */

body.page-id-1180 #booknetic-tab-email-preferences.show
.booknetic_email_preferences_tab > .mb-3 a,
body.page-id-1180 #booknetic-tab-email-preferences.show
.booknetic_email_preferences_tab > .mb-3 button,
body.page-id-1180 #booknetic-tab-email-preferences.show
#booknetic_toggle_all_link {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-width: 96px !important;
    height: 32px !important;
    padding: 0 14px !important;

    background: linear-gradient(
        180deg,
        #171717 0%,
        #0D0D0D 48%,
        #050505 100%
    ) !important;

    color: #FFD700 !important;
    -webkit-text-fill-color: #FFD700 !important;

    border: 1px solid rgba(255,215,0,.72) !important;
    border-radius: 2px !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.05),
        0 4px 12px rgba(0,0,0,.28) !important;

    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: .45px !important;
    text-transform: uppercase !important;
    text-decoration: none !important;

    cursor: pointer !important;
    appearance: none !important;
    -webkit-appearance: none !important;

    transition:
        background .20s ease,
        color .20s ease,
        border-color .20s ease,
        box-shadow .20s ease,
        transform .20s ease !important;
}

body.page-id-1180 #booknetic-tab-email-preferences.show
.booknetic_email_preferences_tab > .mb-3 a:hover,
body.page-id-1180 #booknetic-tab-email-preferences.show
.booknetic_email_preferences_tab > .mb-3 a:focus,
body.page-id-1180 #booknetic-tab-email-preferences.show
.booknetic_email_preferences_tab > .mb-3 button:hover,
body.page-id-1180 #booknetic-tab-email-preferences.show
.booknetic_email_preferences_tab > .mb-3 button:focus,
body.page-id-1180 #booknetic-tab-email-preferences.show
#booknetic_toggle_all_link:hover,
body.page-id-1180 #booknetic-tab-email-preferences.show
#booknetic_toggle_all_link:focus {
    background: linear-gradient(
        180deg,
        #FFF06A 0%,
        #FFD700 48%,
        #D9AD00 100%
    ) !important;

    color: #050505 !important;
    -webkit-text-fill-color: #050505 !important;

    border-color: #FFD700 !important;
    text-decoration: none !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.34),
        0 5px 14px rgba(0,0,0,.30),
        0 0 12px rgba(255,215,0,.14) !important;

    transform: translateY(-1px) !important;
}

/* =========================================================
   EMAIL PREFERENCES — CHECK ALL / UNCHECK ALL
   v24 — exact Booknetic class
   ========================================================= */

body.page-id-1180 a.booknetic_ep_cp_toggle_all {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-width: 100px !important;
    height: 34px !important;
    padding: 0 16px !important;

    background: linear-gradient(
        180deg,
        #1B1B1B 0%,
        #101010 48%,
        #050505 100%
    ) !important;

    border: 1px solid rgba(255, 215, 0, .72) !important;
    border-radius: 2px !important;

    color: #FFD700 !important;
    -webkit-text-fill-color: #FFD700 !important;

    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: .55px !important;
    text-transform: uppercase !important;
    text-decoration: none !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.06),
        0 4px 12px rgba(0,0,0,.30) !important;

    cursor: pointer !important;

    transition:
        background .20s ease,
        border-color .20s ease,
        color .20s ease,
        box-shadow .20s ease,
        transform .20s ease !important;
}

body.page-id-1180 a.booknetic_ep_cp_toggle_all:hover,
body.page-id-1180 a.booknetic_ep_cp_toggle_all:focus,
body.page-id-1180 a.booknetic_ep_cp_toggle_all:active {
    background: linear-gradient(
        180deg,
        #FFF176 0%,
        #FFD700 48%,
        #D6AA00 100%
    ) !important;

    border-color: #FFD700 !important;

    color: #050505 !important;
    -webkit-text-fill-color: #050505 !important;

    text-decoration: none !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.38),
        0 5px 14px rgba(0,0,0,.32),
        0 0 14px rgba(255,215,0,.16) !important;

    transform: translateY(-1px) !important;
}

/* =========================================================
   MOBILE CUSTOMER ACCOUNT — V3
   EDIT THIS SECTION ONLY
   Desktop CSS above remains untouched.
   ========================================================= */

@media only screen and (max-width: 1000px) {

    /* =====================================================
       1. PAGE WIDTH SAFETY
       Lock the document itself to the viewport, but allow
       the account content area to scroll horizontally.
       ===================================================== */

    html,
    body.page-id-1180 {
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
    }

    body.page-id-1180,
    body.page-id-1180 #page,
    body.page-id-1180 .site,
    body.page-id-1180 .site-content,
    body.page-id-1180 .main-row,
    body.page-id-1180 .container,
    body.page-id-1180 article,
    body.page-id-1180 #booknetic-customer-panel,
    body.page-id-1180 #booknetic-customer-panel * {
        box-sizing: border-box !important;
    }

    body.page-id-1180 #booknetic-customer-panel,
    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-body,
    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab-wrapper {
        max-width: 100% !important;
        min-width: 0 !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-body {
        position: relative !important;
        overflow: hidden !important;
    }

    /*
     * IMPORTANT:
     * The document stays locked to the viewport, but individual
     * Appointment / Package / Profile content may scroll sideways.
     */
    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab-wrapper,
    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab-body {
        min-width: 0 !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab-body {
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: auto !important;
        overflow-y: visible !important;
        -webkit-overflow-scrolling: touch !important;
        overscroll-behavior-x: contain !important;
        touch-action: pan-x pan-y !important;
    }


    /* =====================================================
       2. COMPACT CUSTOMER HEADER
       ===================================================== */

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-header {
        min-height: 0 !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-header-info {
        min-height: 74px !important;
        padding: 10px 12px !important;
        gap: 8px !important;
        align-items: center !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-header-customer-card {
        min-width: 0 !important;
        gap: 10px !important;
        flex: 1 1 auto !important;
        overflow: hidden !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-header-customer-card-img {
        width: 44px !important;
        height: 44px !important;
        min-width: 44px !important;
        border-color: #3B3B3B !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-header-customer-card-info {
        min-width: 0 !important;
        flex: 1 1 auto !important;
        overflow: hidden !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-header-customer-card-info h2 {
        margin: 0 0 2px !important;
        font-size: 16px !important;
        line-height: 1.08 !important;
        font-weight: 500 !important;
        letter-spacing: 0 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-header-customer-card-info > p {
        display: block !important;
        margin: 2px 0 0 !important;
        max-width: 100% !important;
        color: #858585 !important;
        font-size: 9px !important;
        line-height: 12px !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-loyalty-points-container {
        margin: 1px 0 !important;
        padding: 0 !important;
        line-height: 1 !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-customer-point-badge {
        min-height: 17px !important;
        margin: 0 !important;
        padding: 2px 7px !important;
        font-size: 7.5px !important;
        line-height: 11px !important;
    }


    /* =====================================================
       3. REFINED MOBILE LOG OUT BUTTON
       ===================================================== */

    body.page-id-1180 #booknetic-customer-panel
    .booknetic-cp-header-logout-btn.booknetic_cp_header_logout_btn {
        flex: 0 0 auto !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 6px !important;

        min-width: 84px !important;
        width: auto !important;
        height: 32px !important;
        margin: 0 !important;
        padding: 0 10px !important;

        background:
            linear-gradient(180deg,
                rgba(24,24,24,.72) 0%,
                rgba(5,5,5,.84) 100%) !important;

        border: 1px solid rgba(255,215,0,.52) !important;
        border-radius: 3px !important;

        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.035),
            0 4px 14px rgba(0,0,0,.22) !important;

        backdrop-filter: blur(12px) saturate(110%) !important;
        -webkit-backdrop-filter: blur(12px) saturate(110%) !important;

        color: #F4F4F4 !important;
        font-size: 8px !important;
        font-weight: 700 !important;
        letter-spacing: .55px !important;
        overflow: hidden !important;
    }

    body.page-id-1180 #booknetic-customer-panel
    .booknetic-cp-header-logout-btn.booknetic_cp_header_logout_btn i {
        color: #FFD700 !important;
        font-size: 10px !important;
    }

    body.page-id-1180 #booknetic-customer-panel
    .booknetic-cp-header-logout-btn.booknetic_cp_header_logout_btn span {
        display: inline-block !important;
        color: #F4F4F4 !important;
        -webkit-text-fill-color: #F4F4F4 !important;
    }

    body.page-id-1180 #booknetic-customer-panel
    .booknetic-cp-header-logout-btn.booknetic_cp_header_logout_btn:hover,
    body.page-id-1180 #booknetic-customer-panel
    .booknetic-cp-header-logout-btn.booknetic_cp_header_logout_btn:focus {
        background: linear-gradient(180deg, #FFE66A 0%, #FFD700 50%, #E6B800 100%) !important;
        border-color: #FFD700 !important;
        color: #050505 !important;
    }

    body.page-id-1180 #booknetic-customer-panel
    .booknetic-cp-header-logout-btn.booknetic_cp_header_logout_btn:hover i,
    body.page-id-1180 #booknetic-customer-panel
    .booknetic-cp-header-logout-btn.booknetic_cp_header_logout_btn:hover span,
    body.page-id-1180 #booknetic-customer-panel
    .booknetic-cp-header-logout-btn.booknetic_cp_header_logout_btn:focus i,
    body.page-id-1180 #booknetic-customer-panel
    .booknetic-cp-header-logout-btn.booknetic_cp_header_logout_btn:focus span {
        color: #050505 !important;
        -webkit-text-fill-color: #050505 !important;
    }


    /* =====================================================
       4. COLLAPSED SIDEBAR
       ===================================================== */

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tabs {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;

        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;

        width: 52px !important;
        min-width: 52px !important;
        max-width: 52px !important;
        height: 100% !important;
        min-height: 100% !important;

        margin: 0 !important;
        padding: 8px 5px !important;

        background:
            linear-gradient(180deg,
                rgba(20,20,20,.63) 0%,
                rgba(5,5,5,.72) 100%) !important;

        border: 0 !important;
        border-right: 1px solid rgba(255,215,0,.24) !important;
        border-radius: 0 !important;

        box-shadow:
            10px 0 28px rgba(0,0,0,.20),
            inset -1px 0 0 rgba(255,255,255,.014) !important;

        backdrop-filter: blur(18px) saturate(112%) !important;
        -webkit-backdrop-filter: blur(18px) saturate(112%) !important;

        overflow: hidden !important;
        z-index: 50 !important;

        transition:
            width .26s ease,
            max-width .26s ease,
            background .26s ease,
            box-shadow .26s ease !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab-wrapper {
        width: calc(100% - 52px) !important;
        max-width: calc(100% - 52px) !important;
        margin-left: 52px !important;
        transition:
            margin-left .26s ease,
            width .26s ease,
            max-width .26s ease !important;
    }


    /* =====================================================
       5. EXPANDED GLASS SIDEBAR
       ===================================================== */

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tabs.expand {
        width: min(230px, 70vw) !important;
        min-width: 0 !important;
        max-width: min(230px, 70vw) !important;

        background:
            linear-gradient(180deg,
                rgba(23,23,23,.68) 0%,
                rgba(9,9,9,.73) 48%,
                rgba(2,2,2,.79) 100%) !important;

        border-right: 1px solid rgba(255,215,0,.38) !important;

        box-shadow:
            16px 0 40px rgba(0,0,0,.38),
            0 0 18px rgba(255,215,0,.025),
            inset -1px 0 0 rgba(255,255,255,.018) !important;

        backdrop-filter: blur(22px) saturate(118%) !important;
        -webkit-backdrop-filter: blur(22px) saturate(118%) !important;

        overflow: hidden !important;
    }


    /* =====================================================
       6. SIDEBAR TOGGLE
       ===================================================== */

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-sidebar-toggle {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 40px !important;
        min-width: 40px !important;
        height: 36px !important;

        margin: 0 0 8px !important;
        padding: 0 !important;

        background:
            linear-gradient(180deg,
                rgba(255,215,0,.08) 0%,
                rgba(255,215,0,.018) 100%) !important;

        color: #FFD700 !important;
        border: 1px solid rgba(255,215,0,.34) !important;
        border-radius: 3px !important;

        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.025),
            0 3px 10px rgba(0,0,0,.16) !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-sidebar-toggle i {
        color: #FFD700 !important;
        font-size: 11px !important;
        transition: transform .26s ease !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-sidebar-toggle.active i {
        transform: rotate(180deg) !important;
    }

    body.page-id-1180 #booknetic-customer-panel
    .booknetic-cp-tabs.expand .booknetic-cp-sidebar-toggle {
        align-self: flex-end !important;
        margin-right: 2px !important;
    }


    /* =====================================================
       7. TAB ITEMS
       ===================================================== */

    body.page-id-1180 #booknetic-customer-panel
    .booknetic-cp-tabs .booknetic-cp-tab-item {
        position: relative !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 12px !important;

        width: 40px !important;
        min-width: 40px !important;
        max-width: 40px !important;
        height: 44px !important;

        margin: 1px 0 !important;
        padding: 0 11px !important;

        background: transparent !important;
        color: #858585 !important;

        border: 0 !important;
        border-radius: 3px !important;
        box-shadow: none !important;

        overflow: hidden !important;
    }

    body.page-id-1180 #booknetic-customer-panel
    .booknetic-cp-tabs.expand .booknetic-cp-tab-item {
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
        height: 47px !important;
        padding: 0 13px !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab-item i {
        width: 17px !important;
        min-width: 17px !important;
        color: #818181 !important;
        font-size: 12px !important;
        text-align: center !important;
    }

    body.page-id-1180 #booknetic-customer-panel
    .booknetic-cp-tab-item .booknetic-cp-tab-item-name {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;

        color: #C8C8C8 !important;
        font-family: Helvetica, Arial, sans-serif !important;
        font-size: 10.5px !important;
        font-weight: 500 !important;
        line-height: 1 !important;
        letter-spacing: .1px !important;
        white-space: nowrap !important;
    }

    body.page-id-1180 #booknetic-customer-panel
    .booknetic-cp-tabs.expand .booknetic-cp-tab-item .booknetic-cp-tab-item-name {
        display: inline-block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab-item.active {
        background:
            linear-gradient(90deg,
                rgba(255,215,0,.13) 0%,
                rgba(255,215,0,.045) 70%,
                rgba(255,215,0,0) 100%) !important;
        color: #FFFFFF !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab-item.active::before {
        content: "" !important;
        position: absolute !important;
        left: 0 !important;
        top: 9px !important;
        bottom: 9px !important;
        width: 2px !important;
        background: #FFD700 !important;
        border-radius: 2px !important;
        box-shadow: 0 0 6px rgba(255,215,0,.22) !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab-item.active::after {
        content: none !important;
        display: none !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab-item.active i {
        color: #FFD700 !important;
    }

    body.page-id-1180 #booknetic-customer-panel
    .booknetic-cp-tab-item.active .booknetic-cp-tab-item-name {
        color: #FFFFFF !important;
    }


    /* =====================================================
       8. MOBILE COUNTRY PICKER — V3
       Constrain every intl-tel-input layer to the viewport.
       ===================================================== */

    body.page-id-1180 .iti,
    body.page-id-1180 .iti__tel-input,
    body.page-id-1180 .iti__country-container {
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    body.page-id-1180 .iti__dropdown-content {
        position: fixed !important;
        left: 8px !important;
        right: auto !important;
        top: 12vh !important;

        width: calc(100vw - 16px) !important;
        min-width: 0 !important;
        max-width: calc(100vw - 16px) !important;

        margin: 0 !important;
        transform: none !important;

        background:
            linear-gradient(180deg, #111111 0%, #080808 100%) !important;

        border: 1px solid #303030 !important;
        border-top-color: rgba(255,215,0,.72) !important;
        border-radius: 4px !important;

        box-shadow:
            0 22px 60px rgba(0,0,0,.78),
            0 0 0 1px rgba(255,255,255,.015) !important;

        overflow: hidden !important;
        z-index: 999999 !important;

        contain: layout paint !important;
    }

    body.page-id-1180 .iti__dropdown-content *,
    body.page-id-1180 .iti__country-list,
    body.page-id-1180 .iti__country {
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    body.page-id-1180 .iti__search-input-wrapper {
        width: 100% !important;
        max-width: 100% !important;
        min-height: 48px !important;
        padding: 8px 10px !important;
        background: #101010 !important;
        border-bottom: 1px solid #2B2B2B !important;
        overflow: hidden !important;
    }

    body.page-id-1180 .iti__search-input {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: 32px !important;
        min-height: 32px !important;

        padding: 0 34px !important;

        background: #101010 !important;
        color: #F1F1F1 !important;

        border: 0 !important;
        border-bottom: 1px solid #353535 !important;
        border-radius: 0 !important;

        box-shadow: none !important;
        outline: none !important;

        font-family: Helvetica, Arial, sans-serif !important;
        font-size: 12px !important;
    }

    body.page-id-1180 .iti__search-input:focus {
        border-bottom-color: #FFD700 !important;
    }

    body.page-id-1180 .iti__search-input::placeholder {
        color: #777777 !important;
        opacity: 1 !important;
    }

    body.page-id-1180 .iti__country-list {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        max-height: calc(56dvh - 50px) !important;

        margin: 0 !important;
        padding: 4px 0 !important;

        background: #090909 !important;
        color: #D5D5D5 !important;

        overflow-x: hidden !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch !important;
        overscroll-behavior: contain !important;
    }

    body.page-id-1180 .iti__country-list,
    body.page-id-1180 .iti__country-list li,
    body.page-id-1180 .iti__country {
        list-style: none !important;
    }

    body.page-id-1180 .iti__country::before,
    body.page-id-1180 .iti__country-list li::before {
        content: none !important;
        display: none !important;
    }

    body.page-id-1180 .iti__country {
        position: relative !important;
        display: flex !important;
        align-items: center !important;
        gap: 10px !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        min-height: 42px !important;
        padding: 0 14px !important;

        background: transparent !important;
        color: #CECECE !important;

        border: 0 !important;
        border-bottom: 1px solid rgba(255,255,255,.045) !important;
        box-shadow: none !important;

        font-family: Helvetica, Arial, sans-serif !important;
        font-size: 11px !important;

        overflow: hidden !important;
    }

    body.page-id-1180 .iti__flag-box,
    body.page-id-1180 .iti__flag {
        flex: 0 0 auto !important;
        max-width: none !important;
    }

    body.page-id-1180 .iti__country-name {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        max-width: 100% !important;
        padding-right: 24px !important;
        color: inherit !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    body.page-id-1180 .iti__dial-code {
        flex: 0 0 auto !important;
        margin-left: 5px !important;
        color: #797979 !important;
        font-size: 10px !important;
        white-space: nowrap !important;
    }

    body.page-id-1180 .iti__country:hover,
    body.page-id-1180 .iti__country.iti__highlight {
        background: #151515 !important;
        color: #FFFFFF !important;
        box-shadow: inset 2px 0 0 rgba(255,215,0,.70) !important;
    }

    body.page-id-1180 .iti__country[aria-selected="true"] {
        background:
            linear-gradient(90deg,
                rgba(255,215,0,.09) 0%,
                rgba(255,215,0,.025) 100%) !important;
        color: #FFFFFF !important;
        box-shadow: inset 2px 0 0 #FFD700 !important;
    }

    body.page-id-1180 .iti__country[aria-selected="true"]::after {
        content: "✓" !important;
        display: block !important;
        position: absolute !important;
        right: 13px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        color: #FFD700 !important;
        font-size: 11px !important;
        font-weight: 700 !important;
        line-height: 1 !important;
    }
}


/* =========================================================
   SMALL PHONES
   ========================================================= */

@media only screen and (max-width: 480px) {

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-header-info {
        min-height: 70px !important;
        padding: 9px 10px !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-header-customer-card-img {
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
    }

    body.page-id-1180 #booknetic-customer-panel
    .booknetic-cp-header-logout-btn.booknetic_cp_header_logout_btn {
        min-width: 80px !important;
        height: 30px !important;
        padding: 0 9px !important;
        font-size: 7.5px !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tabs.expand {
        width: min(218px, 72vw) !important;
        max-width: min(218px, 72vw) !important;
    }

    body.page-id-1180 .iti__dropdown-content {
        left: 6px !important;
        width: calc(100vw - 12px) !important;
        max-width: calc(100vw - 12px) !important;
        top: 10vh !important;
        max-height: 56dvh !important;
    }

    body.page-id-1180 .iti__country-list {
        max-height: calc(56dvh - 50px) !important;
    }
}

/* =========================================================
   MOBILE CUSTOMER ACCOUNT — V4 FIXES
   1) Country picker specificity / closed-state width
   2) Horizontal content scroll isolated from page width
   ========================================================= */

@media only screen and (max-width: 1000px) {

    /* -----------------------------------------------------
       APPOINTMENTS / PACKAGES
       Keep the PAGE vertical. The tab content owns horizontal
       movement. Direction locking is completed by the small
       JS companion snippet supplied with V4.
       ----------------------------------------------------- */

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab-body {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow-x: auto !important;
        overflow-y: visible !important;
        -webkit-overflow-scrolling: touch !important;
        overscroll-behavior-x: contain !important;
    }

    /* Never let the wide tables enlarge the actual document. */
    body.page-id-1180 #booknetic_customer_panel_appointments_table,
    body.page-id-1180 #booknetic_customer_panel_packages_table {
        width: max-content !important;
        min-width: 100% !important;
        max-width: none !important;
    }


    /* -----------------------------------------------------
       COUNTRY PICKER
       IMPORTANT: these selectors deliberately match/exceed
       the high-specificity desktop selectors in v24.
       ----------------------------------------------------- */

    body.page-id-1180
    #booknetic-customer-panel
    #bookentic-cp-user-form
    .iti {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    body.page-id-1180
    #booknetic-customer-panel
    #bookentic-cp-user-form
    .iti__country-container {
        max-width: 100% !important;
    }

    body.page-id-1180
    #booknetic-customer-panel
    #bookentic-cp-user-form
    .iti__dropdown-content {
        position: fixed !important;

        left: 8px !important;
        right: auto !important;
        top: 12vh !important;

        width: calc(100vw - 16px) !important;
        min-width: 0 !important;
        max-width: calc(100vw - 16px) !important;

        margin: 0 !important;
        padding: 0 !important;

        transform: none !important;

        background: linear-gradient(180deg, #111111 0%, #080808 100%) !important;

        border: 1px solid #303030 !important;
        border-top: 1px solid rgba(255,215,0,.72) !important;
        border-radius: 4px !important;

        box-shadow:
            0 22px 60px rgba(0,0,0,.78),
            0 0 0 1px rgba(255,255,255,.015) !important;

        overflow: hidden !important;
        z-index: 999999 !important;

        contain: layout paint size !important;
    }

    body.page-id-1180
    #booknetic-customer-panel
    #bookentic-cp-user-form
    .iti__search-input-wrapper,
    body.page-id-1180
    #booknetic-customer-panel
    #bookentic-cp-user-form
    .iti__search-input,
    body.page-id-1180
    #booknetic-customer-panel
    #bookentic-cp-user-form
    .iti__country-list,
    body.page-id-1180
    #booknetic-customer-panel
    #bookentic-cp-user-form
    .iti__country {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    body.page-id-1180
    #booknetic-customer-panel
    #bookentic-cp-user-form
    .iti__country-list {
        max-height: calc(56dvh - 50px) !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }

    /* intl-tel-input uses .iti__hide when the popup closes.
       Remove it completely from layout so Safari cannot keep
       its former dropdown width as scrollable page width. */
    body.page-id-1180
    #booknetic-customer-panel
    #bookentic-cp-user-form
    .iti__dropdown-content.iti__hide,
    body.page-id-1180
    #booknetic-customer-panel
    #bookentic-cp-user-form
    .iti__hide {
        display: none !important;
        position: fixed !important;
        left: 0 !important;
        top: 0 !important;
        width: 0 !important;
        min-width: 0 !important;
        max-width: 0 !important;
        height: 0 !important;
        min-height: 0 !important;
        max-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        overflow: hidden !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }
}

@media only screen and (max-width: 480px) {
    body.page-id-1180
    #booknetic-customer-panel
    #bookentic-cp-user-form
    .iti__dropdown-content {
        left: 6px !important;
        width: calc(100vw - 12px) !important;
        max-width: calc(100vw - 12px) !important;
        top: 10vh !important;
    }
}

/* =========================================================
   MOBILE CUSTOMER ACCOUNT — V5 COUNTRY PICKER FIX
   Native scrolling only. No direction-lock JavaScript.
   This targets intl-tel-input's MOBILE container as well as
   the in-form picker so opening/closing cannot widen the page.
   ========================================================= */

@media only screen and (max-width: 1000px) {

    /* Keep the site itself fixed to the viewport. */
    html,
    body.page-id-1180,
    body.page-id-1180 #page,
    body.page-id-1180 .site,
    body.page-id-1180 .main-row,
    body.page-id-1180 .container,
    body.page-id-1180 article {
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: clip !important;
    }

    /* Restore native touch behaviour in the account content. */
    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab-body {
        overflow-x: auto !important;
        overflow-y: visible !important;
        -webkit-overflow-scrolling: touch !important;
        touch-action: auto !important;
        overscroll-behavior-x: contain !important;
    }

    /* -----------------------------------------------------
       PHONE FIELD ITSELF
       Undo desktop overflow behaviour on mobile.
       ----------------------------------------------------- */

    body.page-id-1180
    #booknetic-customer-panel
    #bookentic-cp-user-form
    .iti {
        position: relative !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow: visible !important;
    }

    body.page-id-1180
    #booknetic-customer-panel
    #bookentic-cp-user-form
    .iti__country-container {
        max-width: 100% !important;
        overflow: hidden !important;
    }

    body.page-id-1180
    #booknetic-customer-panel
    #bookentic-cp-user-form
    .iti__selected-country {
        max-width: 118px !important;
        overflow: hidden !important;
    }

    /* -----------------------------------------------------
       INTL-TEL-INPUT MOBILE POPUP CONTAINER
       Newer versions append this directly to <body>.
       This is the element most likely to be widening Safari.
       ----------------------------------------------------- */

    body.page-id-1180 > .iti--container,
    body.page-id-1180 .iti--container,
    body.page-id-1180 > .iti.iti--container,
    body.page-id-1180 .iti.iti--container,
    body.page-id-1180 .iti--fullscreen-popup {
        position: fixed !important;

        left: 0 !important;
        right: 0 !important;
        top: 0 !important;
        bottom: 0 !important;

        width: 100vw !important;
        min-width: 0 !important;
        max-width: 100vw !important;

        height: 100dvh !important;
        min-height: 0 !important;
        max-height: 100dvh !important;

        margin: 0 !important;
        padding: 0 !important;

        box-sizing: border-box !important;
        overflow: hidden !important;

        transform: none !important;
        translate: none !important;

        background: rgba(0,0,0,.72) !important;

        z-index: 999999 !important;

        contain: layout paint size !important;
        overscroll-behavior: contain !important;
    }

    /* Popup card */
    body.page-id-1180 > .iti--container .iti__dropdown-content,
    body.page-id-1180 .iti--container .iti__dropdown-content,
    body.page-id-1180 .iti--fullscreen-popup .iti__dropdown-content {
        position: absolute !important;

        left: 10px !important;
        right: 10px !important;
        top: 12vh !important;

        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;

        max-height: 64dvh !important;

        margin: 0 !important;
        padding: 0 !important;

        transform: none !important;

        background: linear-gradient(180deg, #111111 0%, #080808 100%) !important;
        color: #E5E5E5 !important;

        border: 1px solid #303030 !important;
        border-top: 1px solid rgba(255,215,0,.72) !important;
        border-radius: 3px !important;

        box-shadow: 0 22px 60px rgba(0,0,0,.78) !important;

        overflow: hidden !important;
        box-sizing: border-box !important;

        contain: layout paint !important;
    }

    /* Popup internals can never exceed the card width. */
    body.page-id-1180 > .iti--container .iti__dropdown-content *,
    body.page-id-1180 .iti--container .iti__dropdown-content *,
    body.page-id-1180 .iti--fullscreen-popup .iti__dropdown-content * {
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    body.page-id-1180 > .iti--container .iti__search-input-wrapper,
    body.page-id-1180 .iti--container .iti__search-input-wrapper,
    body.page-id-1180 .iti--fullscreen-popup .iti__search-input-wrapper {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;

        padding: 8px 10px !important;

        background: #101010 !important;
        border-bottom: 1px solid #2B2B2B !important;

        overflow: hidden !important;
    }

    body.page-id-1180 > .iti--container .iti__search-input,
    body.page-id-1180 .iti--container .iti__search-input,
    body.page-id-1180 .iti--fullscreen-popup .iti__search-input {
        display: block !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;

        height: 34px !important;
        min-height: 34px !important;

        padding: 0 34px !important;

        background: #101010 !important;
        color: #FFFFFF !important;

        border: 0 !important;
        border-bottom: 1px solid #353535 !important;
        border-radius: 0 !important;

        box-shadow: none !important;
        outline: none !important;

        font-family: Helvetica, Arial, sans-serif !important;
        font-size: 12px !important;
    }

    body.page-id-1180 > .iti--container .iti__country-list,
    body.page-id-1180 .iti--container .iti__country-list,
    body.page-id-1180 .iti--fullscreen-popup .iti__country-list {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;

        max-height: calc(64dvh - 52px) !important;

        margin: 0 !important;
        padding: 4px 0 !important;

        background: #090909 !important;
        color: #D5D5D5 !important;

        overflow-x: hidden !important;
        overflow-y: auto !important;

        -webkit-overflow-scrolling: touch !important;
        overscroll-behavior: contain !important;
    }

    body.page-id-1180 > .iti--container .iti__country,
    body.page-id-1180 .iti--container .iti__country,
    body.page-id-1180 .iti--fullscreen-popup .iti__country {
        position: relative !important;

        display: flex !important;
        align-items: center !important;
        gap: 9px !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;

        min-height: 42px !important;

        margin: 0 !important;
        padding: 0 14px !important;

        background: #090909 !important;
        color: #D2D2D2 !important;

        border: 0 !important;
        border-bottom: 1px solid rgba(255,255,255,.045) !important;

        overflow: hidden !important;

        font-family: Helvetica, Arial, sans-serif !important;
        font-size: 11px !important;
    }

    body.page-id-1180 > .iti--container .iti__country-name,
    body.page-id-1180 .iti--container .iti__country-name,
    body.page-id-1180 .iti--fullscreen-popup .iti__country-name {
        flex: 1 1 auto !important;
        min-width: 0 !important;

        color: inherit !important;

        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    body.page-id-1180 > .iti--container .iti__dial-code,
    body.page-id-1180 .iti--container .iti__dial-code,
    body.page-id-1180 .iti--fullscreen-popup .iti__dial-code {
        flex: 0 0 auto !important;
        white-space: nowrap !important;

        color: #7F7F7F !important;
        font-size: 10px !important;
    }

    body.page-id-1180 > .iti--container .iti__country.iti__highlight,
    body.page-id-1180 .iti--container .iti__country.iti__highlight,
    body.page-id-1180 .iti--fullscreen-popup .iti__country.iti__highlight {
        background: #151515 !important;
        color: #FFFFFF !important;
        box-shadow: inset 2px 0 0 #FFD700 !important;
    }

    /* -----------------------------------------------------
       CLOSED STATE
       If the mobile container remains in the DOM after closing,
       it contributes zero layout/scroll size.
       ----------------------------------------------------- */

    body.page-id-1180 > .iti--container.iti__hide,
    body.page-id-1180 .iti--container.iti__hide,
    body.page-id-1180 .iti--container[hidden],
    body.page-id-1180 .iti--fullscreen-popup.iti__hide,
    body.page-id-1180 .iti--fullscreen-popup[hidden] {
        display: none !important;

        width: 0 !important;
        min-width: 0 !important;
        max-width: 0 !important;

        height: 0 !important;
        min-height: 0 !important;
        max-height: 0 !important;

        left: 0 !important;
        right: auto !important;
        top: 0 !important;
        bottom: auto !important;

        margin: 0 !important;
        padding: 0 !important;

        border: 0 !important;

        overflow: hidden !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }
}


/* Small-phone refinement */
@media only screen and (max-width: 480px) {

    body.page-id-1180 > .iti--container .iti__dropdown-content,
    body.page-id-1180 .iti--container .iti__dropdown-content,
    body.page-id-1180 .iti--fullscreen-popup .iti__dropdown-content {
        left: 6px !important;
        right: 6px !important;
        top: 10vh !important;
        max-height: 66dvh !important;
    }

    body.page-id-1180 > .iti--container .iti__country-list,
    body.page-id-1180 .iti--container .iti__country-list,
    body.page-id-1180 .iti--fullscreen-popup .iti__country-list {
        max-height: calc(66dvh - 52px) !important;
    }
}

/* =========================================================
   MOBILE CUSTOMER ACCOUNT — V6 iPHONE ZOOM FIX
   Safari automatically zooms focused form controls below
   16px. The country search auto-focuses when opened, which
   was making the whole site appear wider / shifted.
   ========================================================= */

@media only screen and (max-width: 1000px) {

    /* Country search: 16px prevents iOS Safari focus zoom. */
    body.page-id-1180 .iti__search-input,
    body.page-id-1180 > .iti--container .iti__search-input,
    body.page-id-1180 .iti--container .iti__search-input,
    body.page-id-1180 .iti--fullscreen-popup .iti__search-input,
    body.page-id-1180 #booknetic-customer-panel #bookentic-cp-user-form .iti__search-input {
        font-size: 16px !important;
        line-height: 1.2 !important;
        -webkit-text-size-adjust: 100% !important;
    }

    /* Also protect the actual phone field from the same Safari zoom. */
    body.page-id-1180
    #booknetic-customer-panel
    #bookentic-cp-user-form
    input[type="tel"],
    body.page-id-1180
    #booknetic-customer-panel
    #bookentic-cp-user-form
    .iti__tel-input {
        font-size: 16px !important;
        -webkit-text-size-adjust: 100% !important;
    }
}

/* =========================================================
   MOBILE CUSTOMER ACCOUNT — V7
   APPOINTMENTS + PACKAGES AS MOBILE CARDS
   Desktop v24 and country-picker v6 remain unchanged.
   ========================================================= */

@media only screen and (max-width: 1000px) {

    /* -----------------------------------------------------
       Stop these two tabs behaving like wide desktop tables.
       Mobile becomes vertical-only content.
       ----------------------------------------------------- */

    body.page-id-1180 #booknetic-tab-appointments,
    body.page-id-1180 #booknetic-tab-packages {
        overflow-x: hidden !important;
        overflow-y: visible !important;
        touch-action: pan-y !important;
    }

    body.page-id-1180
    #booknetic-tab-appointments
    .booknetic-cp-tab-body,
    body.page-id-1180
    #booknetic-tab-packages
    .booknetic-cp-tab-body {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        padding: 12px 10px 22px !important;

        overflow-x: hidden !important;
        overflow-y: visible !important;

        touch-action: pan-y !important;
        overscroll-behavior-x: none !important;
    }


    /* =====================================================
       APPOINTMENTS — CARD LIST
       ===================================================== */

    body.page-id-1180
    #booknetic_customer_panel_appointments_table {
        display: block !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;

        margin: 0 !important;

        border-collapse: separate !important;
        border-spacing: 0 !important;

        overflow: visible !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table thead {
        display: none !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody tr {
        position: relative !important;

        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 0 !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;

        margin: 0 !important;
        padding: 13px 13px 12px !important;

        background:
            linear-gradient(145deg,
                rgba(20,20,20,.94) 0%,
                rgba(8,8,8,.97) 100%) !important;

        border: 1px solid #2D2D2D !important;
        border-radius: 4px !important;

        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.018),
            0 7px 18px rgba(0,0,0,.18) !important;

        overflow: hidden !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody tr::before {
        content: "" !important;
        position: absolute !important;

        left: 0 !important;
        top: 13px !important;
        bottom: 13px !important;

        width: 2px !important;

        background: linear-gradient(180deg, #FFE66A 0%, #FFD700 55%, #B69400 100%) !important;

        box-shadow: 0 0 7px rgba(255,215,0,.18) !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody tr:hover {
        background:
            linear-gradient(145deg,
                rgba(23,23,23,.96) 0%,
                rgba(10,10,10,.98) 100%) !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody td {
        position: relative !important;

        display: grid !important;
        grid-template-columns: 82px minmax(0, 1fr) !important;
        align-items: center !important;
        column-gap: 10px !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        min-height: 0 !important;

        margin: 0 !important;
        padding: 7px 0 !important;

        color: #D2D2D2 !important;

        border: 0 !important;
        border-bottom: 1px solid rgba(255,255,255,.045) !important;

        font-size: 11px !important;
        line-height: 1.35 !important;

        white-space: normal !important;
        overflow-wrap: anywhere !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody td:last-child {
        border-bottom: 0 !important;
        padding-bottom: 1px !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody td::before {
        color: #747474 !important;

        font-family: Helvetica, Arial, sans-serif !important;
        font-size: 7px !important;
        font-weight: 700 !important;
        line-height: 1 !important;

        letter-spacing: .55px !important;
        text-transform: uppercase !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody td:nth-child(1)::before {
        content: "APPOINTMENT" !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody td:nth-child(2)::before {
        content: "SERVICE" !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody td:nth-child(3)::before {
        content: "STAFF" !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody td:nth-child(4)::before {
        content: "DATE / TIME" !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody td:nth-child(5)::before {
        content: "PRICE" !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody td:nth-child(6)::before {
        content: "STATUS" !important;
    }

    /* Service becomes the card headline. */
    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody td:nth-child(2) {
        order: -10 !important;

        display: block !important;

        padding: 2px 0 10px !important;

        color: #FFFFFF !important;

        border-bottom-color: rgba(255,215,0,.16) !important;

        font-size: 14px !important;
        font-weight: 600 !important;
        line-height: 1.25 !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody td:nth-child(2)::before {
        display: block !important;

        margin: 0 0 5px !important;

        color: #FFD700 !important;

        font-size: 7px !important;
    }

    /* Appointment ID quiet. */
    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody td:first-child {
        color: #8A8A8A !important;
        font-size: 10px !important;
    }

    /* Price. */
    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody td:nth-child(5) {
        color: #FFD700 !important;
        font-weight: 600 !important;
        white-space: normal !important;
    }

    /* Status row. */
    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody td:nth-child(6) {
        align-items: center !important;
        color: #BDBDBD !important;
        white-space: normal !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table
    .booknetic_appointment_status_td
    .booknetic_appointment_status_all {
        justify-self: start !important;

        min-width: 0 !important;
        height: 22px !important;

        padding: 0 9px !important;

        font-size: 7px !important;
    }

    /* Staff remains compact. */
    body.page-id-1180
    #booknetic_customer_panel_appointments_table
    .user_visit_card {
        min-width: 0 !important;
        gap: 7px !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table
    .circle_image {
        width: 30px !important;
        height: 30px !important;
        min-width: 30px !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table
    .user_visit_details {
        min-width: 0 !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table
    .user_visit_details span {
        white-space: normal !important;
        overflow-wrap: anywhere !important;
    }


    /* =====================================================
       PACKAGES — CARD LIST
       ===================================================== */

    body.page-id-1180
    #booknetic_customer_panel_packages_table {
        display: block !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;

        margin: 0 !important;

        border-collapse: separate !important;
        border-spacing: 0 !important;

        overflow: visible !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_packages_table thead {
        display: none !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_packages_table tbody {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_packages_table tbody tr {
        position: relative !important;

        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;

        margin: 0 !important;
        padding: 13px !important;

        background:
            linear-gradient(145deg,
                rgba(20,20,20,.94) 0%,
                rgba(8,8,8,.97) 100%) !important;

        border: 1px solid #2D2D2D !important;
        border-radius: 4px !important;

        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.018),
            0 7px 18px rgba(0,0,0,.18) !important;

        overflow: hidden !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_packages_table tbody tr::before {
        content: "" !important;
        position: absolute !important;

        left: 0 !important;
        top: 13px !important;
        bottom: 13px !important;

        width: 2px !important;

        background: linear-gradient(180deg, #FFE66A 0%, #FFD700 55%, #B69400 100%) !important;

        box-shadow: 0 0 7px rgba(255,215,0,.18) !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_packages_table tbody td {
        position: relative !important;

        display: grid !important;
        grid-template-columns: 78px minmax(0, 1fr) !important;
        align-items: center !important;
        column-gap: 10px !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        min-height: 0 !important;

        margin: 0 !important;
        padding: 7px 0 !important;

        color: #D2D2D2 !important;

        border: 0 !important;
        border-bottom: 1px solid rgba(255,255,255,.045) !important;

        font-size: 11px !important;
        line-height: 1.35 !important;

        white-space: normal !important;
        overflow-wrap: anywhere !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_packages_table tbody td:last-child {
        border-bottom: 0 !important;
        padding-bottom: 1px !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_packages_table tbody td::before {
        color: #747474 !important;

        font-family: Helvetica, Arial, sans-serif !important;
        font-size: 7px !important;
        font-weight: 700 !important;

        letter-spacing: .55px !important;
        text-transform: uppercase !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_packages_table tbody td:nth-child(1)::before {
        content: "PACKAGE" !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_packages_table tbody td:nth-child(2)::before {
        content: "PACKAGE NAME" !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_packages_table tbody td:nth-child(3)::before {
        content: "PRICE" !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_packages_table tbody td:nth-child(4)::before {
        content: "USAGE" !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_packages_table tbody td:nth-child(5)::before {
        content: "DATE" !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_packages_table tbody td:nth-child(6)::before {
        content: "ACTION" !important;
    }

    /* Package name is the headline. */
    body.page-id-1180
    #booknetic_customer_panel_packages_table tbody td:nth-child(2) {
        order: -10 !important;

        display: block !important;

        padding: 2px 0 10px !important;

        color: #FFFFFF !important;

        border-bottom-color: rgba(255,215,0,.16) !important;

        font-size: 14px !important;
        font-weight: 600 !important;
        line-height: 1.3 !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_packages_table tbody td:nth-child(2)::before {
        display: block !important;

        margin: 0 0 5px !important;

        color: #FFD700 !important;

        font-size: 7px !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_packages_table tbody td:first-child {
        color: #8A8A8A !important;
        font-size: 10px !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_packages_table tbody td:nth-child(3) {
        color: #FFD700 !important;
        font-weight: 600 !important;
        white-space: normal !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_packages_table tbody td:nth-child(4),
    body.page-id-1180
    #booknetic_customer_panel_packages_table tbody td:nth-child(5) {
        color: #CECECE !important;
        white-space: normal !important;
    }

    /* Package actions become full-width footer controls. */
    body.page-id-1180
    #booknetic_customer_panel_packages_table tbody td:nth-child(6) {
        display: block !important;
        padding-top: 11px !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_packages_table tbody td:nth-child(6)::before {
        display: none !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_packages_table tbody td:nth-child(6) button,
    body.page-id-1180
    #booknetic_customer_panel_packages_table tbody td:nth-child(6) a[class*="btn"],
    body.page-id-1180
    #booknetic_customer_panel_packages_table tbody td:nth-child(6) [role="button"] {
        width: 100% !important;
        max-width: 100% !important;
        min-height: 34px !important;

        margin: 0 !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_packages_table progress,
    body.page-id-1180
    #booknetic_customer_panel_packages_table [class*="progress"],
    body.page-id-1180
    #booknetic_customer_panel_packages_table [class*="Progress"] {
        max-width: 100% !important;
    }
}


/* =========================================================
   SMALL PHONES — V7
   ========================================================= */

@media only screen and (max-width: 480px) {

    body.page-id-1180
    #booknetic-tab-appointments
    .booknetic-cp-tab-body,
    body.page-id-1180
    #booknetic-tab-packages
    .booknetic-cp-tab-body {
        padding: 10px 8px 18px !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody tr,
    body.page-id-1180
    #booknetic_customer_panel_packages_table tbody tr {
        padding: 12px 11px 11px !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody td {
        grid-template-columns: 74px minmax(0, 1fr) !important;
        column-gap: 8px !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_packages_table tbody td {
        grid-template-columns: 70px minmax(0, 1fr) !important;
        column-gap: 8px !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody td:nth-child(2),
    body.page-id-1180
    #booknetic_customer_panel_packages_table tbody td:nth-child(2) {
        font-size: 13px !important;
    }
}

/* =========================================================
   MOBILE CUSTOMER ACCOUNT — V8
   Refine Appointments + correctly target Packages
   ========================================================= */

@media only screen and (max-width: 1000px) {

    /* ------------------------------
       APPOINTMENTS — tighter, larger
       ------------------------------ */

    body.page-id-1180
    #booknetic-tab-appointments
    .booknetic-cp-tab-body {
        padding: 10px 8px 18px !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody {
        gap: 8px !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody tr {
        padding: 10px 11px 9px !important;
        border-radius: 3px !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody tr::before {
        top: 10px !important;
        bottom: 10px !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody td {
        grid-template-columns: 92px minmax(0, 1fr) !important;
        column-gap: 10px !important;

        padding: 5px 0 !important;

        font-size: 13px !important;
        line-height: 1.3 !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody td::before {
        font-size: 8px !important;
        letter-spacing: .45px !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody td:nth-child(2) {
        padding: 0 0 8px !important;
        font-size: 16px !important;
        line-height: 1.22 !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody td:nth-child(2)::before {
        margin-bottom: 4px !important;
        font-size: 8px !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody td:first-child {
        font-size: 12px !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table
    .circle_image {
        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table
    .user_visit_card {
        gap: 8px !important;
    }


    /* =====================================================
       PACKAGES — generic table targeting
       The live Packages markup is not using the expected ID,
       so target the active Packages tab's table directly.
       ===================================================== */

    body.page-id-1180
    #booknetic-tab-packages table {
        display: block !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;

        margin: 0 !important;

        border-collapse: separate !important;
        border-spacing: 0 !important;

        overflow: visible !important;
    }

    body.page-id-1180
    #booknetic-tab-packages table thead {
        display: none !important;
    }

    body.page-id-1180
    #booknetic-tab-packages table tbody {
        display: flex !important;
        flex-direction: column !important;
        gap: 8px !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

    body.page-id-1180
    #booknetic-tab-packages table tbody tr {
        position: relative !important;

        display: block !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;

        margin: 0 !important;
        padding: 10px 11px 9px !important;

        background:
            linear-gradient(145deg,
                rgba(20,20,20,.94) 0%,
                rgba(8,8,8,.97) 100%) !important;

        border: 1px solid #2D2D2D !important;
        border-radius: 3px !important;

        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.018),
            0 6px 16px rgba(0,0,0,.16) !important;

        overflow: hidden !important;
    }

    body.page-id-1180
    #booknetic-tab-packages table tbody tr::before {
        content: "" !important;
        position: absolute !important;
        left: 0 !important;
        top: 10px !important;
        bottom: 10px !important;
        width: 2px !important;

        background: linear-gradient(180deg, #FFE66A 0%, #FFD700 55%, #B69400 100%) !important;
        box-shadow: 0 0 7px rgba(255,215,0,.18) !important;
    }

    body.page-id-1180
    #booknetic-tab-packages table tbody td {
        display: grid !important;
        grid-template-columns: 88px minmax(0, 1fr) !important;
        align-items: center !important;
        column-gap: 10px !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;

        padding: 5px 0 !important;

        color: #D2D2D2 !important;

        border: 0 !important;
        border-bottom: 1px solid rgba(255,255,255,.045) !important;

        font-size: 13px !important;
        line-height: 1.3 !important;

        white-space: normal !important;
        overflow-wrap: anywhere !important;
    }

    body.page-id-1180
    #booknetic-tab-packages table tbody td:last-child {
        border-bottom: 0 !important;
    }

    body.page-id-1180
    #booknetic-tab-packages table tbody td::before {
        color: #747474 !important;
        font-family: Helvetica, Arial, sans-serif !important;
        font-size: 8px !important;
        font-weight: 700 !important;
        letter-spacing: .45px !important;
        text-transform: uppercase !important;
    }

    body.page-id-1180
    #booknetic-tab-packages table tbody td:nth-child(1)::before {
        content: "PACKAGE" !important;
    }

    body.page-id-1180
    #booknetic-tab-packages table tbody td:nth-child(2)::before {
        content: "PACKAGE NAME" !important;
    }

    body.page-id-1180
    #booknetic-tab-packages table tbody td:nth-child(3)::before {
        content: "DETAILS" !important;
    }

    body.page-id-1180
    #booknetic-tab-packages table tbody td:nth-child(4)::before {
        content: "USAGE" !important;
    }

    body.page-id-1180
    #booknetic-tab-packages table tbody td:nth-child(5)::before {
        content: "DATE" !important;
    }

    body.page-id-1180
    #booknetic-tab-packages table tbody td:nth-child(6)::before {
        content: "ACTION" !important;
    }

    /* Main package title */
    body.page-id-1180
    #booknetic-tab-packages table tbody td:nth-child(2) {
        display: block !important;
        padding: 0 0 8px !important;

        color: #FFFFFF !important;

        border-bottom-color: rgba(255,215,0,.16) !important;

        font-size: 16px !important;
        font-weight: 600 !important;
        line-height: 1.24 !important;
    }

    body.page-id-1180
    #booknetic-tab-packages table tbody td:nth-child(2)::before {
        display: block !important;
        margin: 0 0 4px !important;

        color: #FFD700 !important;
        font-size: 8px !important;
    }

    body.page-id-1180
    #booknetic-tab-packages table tbody td:first-child {
        color: #8A8A8A !important;
        font-size: 12px !important;
    }

    body.page-id-1180
    #booknetic-tab-packages table tbody td:nth-child(3) {
        color: #FFD700 !important;
        font-weight: 600 !important;
    }

    /* Any manage/action controls */
    body.page-id-1180
    #booknetic-tab-packages table tbody td:last-child button,
    body.page-id-1180
    #booknetic-tab-packages table tbody td:last-child a[class*="btn"],
    body.page-id-1180
    #booknetic-tab-packages table tbody td:last-child [role="button"] {
        width: 100% !important;
        max-width: 100% !important;
        min-height: 34px !important;
        margin: 0 !important;
    }
}

@media only screen and (max-width: 480px) {

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody td,
    body.page-id-1180
    #booknetic-tab-packages table tbody td {
        grid-template-columns: 80px minmax(0, 1fr) !important;
        column-gap: 8px !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody td:nth-child(2),
    body.page-id-1180
    #booknetic-tab-packages table tbody td:nth-child(2) {
        font-size: 15px !important;
    }
}

/* =========================================================
   MOBILE CUSTOMER ACCOUNT — V9
   Concept-style cards + readable package Pay Now popup
   ========================================================= */

@media only screen and (max-width: 1000px) {

    /* =====================================================
       APPOINTMENTS — closer to concept
       ===================================================== */

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody tr {
        padding: 12px 12px 10px !important;
        border: 1px solid #303030 !important;
        border-radius: 5px !important;
        background:
            linear-gradient(145deg,
                rgba(18,18,18,.97) 0%,
                rgba(7,7,7,.99) 100%) !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody tr::before {
        top: 12px !important;
        bottom: 12px !important;
        width: 2px !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody td {
        grid-template-columns: 92px minmax(0,1fr) !important;
        padding: 6px 0 !important;
        font-size: 13px !important;
        border-bottom-color: rgba(255,255,255,.055) !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody td:nth-child(2) {
        margin: 0 0 2px !important;
        padding: 1px 0 10px !important;
        font-size: 17px !important;
        line-height: 1.2 !important;
        font-weight: 600 !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody td:nth-child(2)::before {
        font-size: 8px !important;
        margin-bottom: 5px !important;
    }

    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody td::before {
        font-size: 8px !important;
    }


    /* =====================================================
       PACKAGES — use exact live Booknetic wrapper/classes
       ===================================================== */

    body.page-id-1180
    #booknetic-tab-packages .booknetic-packages-list {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow: hidden !important;
    }

    body.page-id-1180
    #booknetic-tab-packages .booknetic-packages-list .booknetic_elegant_table {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        overflow: visible !important;
    }

    body.page-id-1180
    #booknetic-tab-packages .booknetic-packages-list .booknetic_elegant_table thead {
        display: none !important;
    }

    body.page-id-1180
    #booknetic-tab-packages .booknetic-packages-list .booknetic_elegant_table tbody {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    body.page-id-1180
    #booknetic-tab-packages .booknetic-packages-list .booknetic_elegant_table tbody tr {
        position: relative !important;
        display: block !important;

        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        margin: 0 !important;
        padding: 12px 12px 10px !important;

        background:
            linear-gradient(145deg,
                rgba(18,18,18,.97) 0%,
                rgba(7,7,7,.99) 100%) !important;

        border: 1px solid #303030 !important;
        border-radius: 5px !important;

        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.018),
            0 8px 20px rgba(0,0,0,.18) !important;

        overflow: hidden !important;
    }

    body.page-id-1180
    #booknetic-tab-packages .booknetic-packages-list .booknetic_elegant_table tbody tr::before {
        content: "" !important;
        position: absolute !important;
        left: 0 !important;
        top: 12px !important;
        bottom: 12px !important;
        width: 2px !important;
        background: linear-gradient(180deg, #FFE66A 0%, #FFD700 55%, #B69400 100%) !important;
        box-shadow: 0 0 7px rgba(255,215,0,.18) !important;
    }

    body.page-id-1180
    #booknetic-tab-packages .booknetic-packages-list .booknetic_elegant_table tbody td {
        display: grid !important;
        grid-template-columns: 88px minmax(0,1fr) !important;
        align-items: center !important;
        column-gap: 10px !important;

        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        margin: 0 !important;
        padding: 6px 0 !important;

        color: #D5D5D5 !important;
        border: 0 !important;
        border-bottom: 1px solid rgba(255,255,255,.055) !important;

        font-size: 13px !important;
        line-height: 1.3 !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
    }

    body.page-id-1180
    #booknetic-tab-packages .booknetic-packages-list .booknetic_elegant_table tbody td:last-child {
        border-bottom: 0 !important;
    }

    body.page-id-1180
    #booknetic-tab-packages .booknetic-packages-list .booknetic_elegant_table tbody td::before {
        color: #777777 !important;
        font-family: Helvetica,Arial,sans-serif !important;
        font-size: 8px !important;
        font-weight: 700 !important;
        letter-spacing: .45px !important;
        text-transform: uppercase !important;
    }

    body.page-id-1180
    #booknetic-tab-packages .booknetic-packages-list .booknetic_elegant_table tbody td:nth-child(1)::before {
        content: "PACKAGE" !important;
    }

    body.page-id-1180
    #booknetic-tab-packages .booknetic-packages-list .booknetic_elegant_table tbody td:nth-child(2)::before {
        content: "PACKAGE NAME" !important;
    }

    body.page-id-1180
    #booknetic-tab-packages .booknetic-packages-list .booknetic_elegant_table tbody td:nth-child(3)::before {
        content: "PRICE" !important;
    }

    body.page-id-1180
    #booknetic-tab-packages .booknetic-packages-list .booknetic_elegant_table tbody td:nth-child(4)::before {
        content: "USAGE" !important;
    }

    body.page-id-1180
    #booknetic-tab-packages .booknetic-packages-list .booknetic_elegant_table tbody td:nth-child(5)::before {
        content: "DATE" !important;
    }

    body.page-id-1180
    #booknetic-tab-packages .booknetic-packages-list .booknetic_elegant_table tbody td:nth-child(6)::before {
        content: "ACTION" !important;
    }

    /* Package name as headline */
    body.page-id-1180
    #booknetic-tab-packages .booknetic-packages-list .booknetic_elegant_table tbody td:nth-child(2) {
        display: block !important;
        padding: 1px 0 10px !important;
        color: #FFFFFF !important;
        font-size: 17px !important;
        font-weight: 600 !important;
        line-height: 1.22 !important;
        border-bottom-color: rgba(255,215,0,.16) !important;
    }

    body.page-id-1180
    #booknetic-tab-packages .booknetic-packages-list .booknetic_elegant_table tbody td:nth-child(2)::before {
        display: block !important;
        margin: 0 0 5px !important;
        color: #FFD700 !important;
    }

    body.page-id-1180
    #booknetic-tab-packages .booknetic-packages-list .booknetic_elegant_table tbody td:nth-child(3) {
        color: #FFD700 !important;
        font-weight: 600 !important;
    }

    /* Usage/progress */
    body.page-id-1180
    #booknetic-tab-packages .booknetic-package-progressbar {
        width: 100% !important;
        max-width: 100% !important;
        margin-top: 5px !important;
    }

    /* Full-width actions like concept */
    body.page-id-1180
    #booknetic-tab-packages .booknetic_pay_package_btn,
    body.page-id-1180
    #booknetic-tab-packages .booknetic_manage_package_btn {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: 38px !important;
        margin: 2px 0 0 !important;
        font-size: 10px !important;
    }


    /* =====================================================
       PAY NOW POPUP — mobile readable modal
       ===================================================== */

    body.page-id-1180 #booknetic_packages_pay_now_popup {
        position: fixed !important;
        inset: 0 !important;
        width: 100vw !important;
        height: 100dvh !important;
        max-width: 100vw !important;
        max-height: 100dvh !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        padding: 18px !important;

        background: rgba(0,0,0,.76) !important;

        overflow: hidden !important;
        z-index: 999999 !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup .booknetic_popup_body {
        position: relative !important;

        width: min(360px, calc(100vw - 36px)) !important;
        max-width: calc(100vw - 36px) !important;
        min-width: 0 !important;

        max-height: calc(100dvh - 56px) !important;

        margin: 0 !important;
        padding: 20px 16px 16px !important;

        background: linear-gradient(180deg, #151515 0%, #080808 100%) !important;
        color: #FFFFFF !important;

        border: 1px solid rgba(255,215,0,.62) !important;
        border-radius: 5px !important;

        box-shadow:
            0 24px 70px rgba(0,0,0,.78),
            0 0 0 1px rgba(255,215,0,.04) !important;

        overflow-x: hidden !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup .booknetic_popup_body,
    body.page-id-1180
    #booknetic_packages_pay_now_popup .booknetic_popup_body * {
        box-sizing: border-box !important;
        max-width: 100% !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup label {
        display: block !important;
        margin: 0 0 7px !important;
        color: #AFAFAF !important;
        font-size: 10px !important;
        font-weight: 700 !important;
        letter-spacing: .35px !important;
        text-transform: uppercase !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup .form-control,
    body.page-id-1180
    #booknetic_packages_pay_now_popup select,
    body.page-id-1180
    #booknetic_packages_pay_now_popup input {
        width: 100% !important;
        min-width: 0 !important;
        height: 42px !important;

        padding: 0 12px !important;

        background: #0A0A0A !important;
        color: #FFFFFF !important;
        -webkit-text-fill-color: #FFFFFF !important;

        border: 1px solid #3A3A3A !important;
        border-radius: 2px !important;

        font-size: 16px !important;

        box-shadow: none !important;
        outline: none !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup .form-control:focus,
    body.page-id-1180
    #booknetic_packages_pay_now_popup select:focus,
    body.page-id-1180
    #booknetic_packages_pay_now_popup input:focus {
        border-color: #FFD700 !important;
    }

    /* Buttons */
    body.page-id-1180 #booknetic_packages_pay_now_popup .booknetic_pay_now_popup_cancel,
    body.page-id-1180 #booknetic_packages_pay_now_popup .booknetic_packages_pay_now_popup_confirm {
        min-width: 0 !important;
        min-height: 40px !important;
        height: 40px !important;

        padding: 0 16px !important;

        font-size: 11px !important;
        font-weight: 700 !important;
        letter-spacing: .3px !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup .booknetic_pay_now_popup_cancel {
        background: linear-gradient(180deg,#151515 0%,#090909 100%) !important;
        color: #E3E3E3 !important;
        border: 1px solid rgba(255,215,0,.42) !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup .booknetic_packages_pay_now_popup_confirm {
        background: linear-gradient(180deg,#FFE66A 0%,#FFD700 50%,#E6B800 100%) !important;
        color: #050505 !important;
        border: 1px solid #FFD700 !important;
    }
}

@media only screen and (max-width: 480px) {

    body.page-id-1180
    #booknetic-tab-packages .booknetic-packages-list .booknetic_elegant_table tbody td,
    body.page-id-1180
    #booknetic_customer_panel_appointments_table tbody td {
        grid-template-columns: 82px minmax(0,1fr) !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup {
        padding: 12px !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup .booknetic_popup_body {
        width: calc(100vw - 24px) !important;
        max-width: calc(100vw - 24px) !important;
        max-height: calc(100dvh - 30px) !important;
        padding: 18px 14px 14px !important;
    }
}

/* =========================================================
   MOBILE CUSTOMER ACCOUNT — V10
   Concept-style Appointment + Package cards
   Exact live row structures supplied by Damian.
   Also restyles the real Booknetic Pay Now popup markup.
   ========================================================= */

@media only screen and (max-width: 1000px) {

    /* =====================================================
       SHARED CARD BEHAVIOUR
       ===================================================== */

    body.page-id-1180 #booknetic-tab-appointments,
    body.page-id-1180 #booknetic-tab-packages {
        overflow-x: hidden !important;
        overflow-y: visible !important;
        touch-action: pan-y !important;
    }

    body.page-id-1180 #booknetic-tab-appointments .booknetic-cp-tab-body,
    body.page-id-1180 #booknetic-tab-packages .booknetic-cp-tab-body {
        padding: 10px 8px 18px !important;
        overflow-x: hidden !important;
        overflow-y: visible !important;
        touch-action: pan-y !important;
    }

    /* =====================================================
       APPOINTMENTS
       Exact live row:
       1 ID / 2 SERVICE / 3 STAFF / 4 DATE / 5 PRICE /
       6 DURATION / 7 STATUS / 8 ACTIONS
       ===================================================== */

    body.page-id-1180 #booknetic_customer_panel_appointments_table {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        overflow: visible !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table thead {
        display: none !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
        width: 100% !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody tr {
        position: relative !important;
        display: grid !important;

        grid-template-columns: 74px minmax(0, 1fr) auto !important;
        grid-template-areas:
            "date service status"
            "date meta meta"
            "date actions actions" !important;

        column-gap: 14px !important;
        row-gap: 7px !important;

        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        margin: 0 !important;
        padding: 14px !important;

        background: linear-gradient(145deg, #121212 0%, #080808 100%) !important;
        border: 1px solid #303030 !important;
        border-radius: 7px !important;

        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.02),
            0 8px 20px rgba(0,0,0,.18) !important;

        overflow: hidden !important;
    }

    /* Reset all table cells first */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td {
        display: block !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;

        color: #D8D8D8 !important;
        border: 0 !important;

        font-size: 12px !important;
        line-height: 1.3 !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td::before {
        display: none !important;
        content: none !important;
    }

    /* DATE BLOCK
       td4 contains 2026-09-27 09:00.
       Use pseudo labels around the live value to create the
       compact date-column feel from the concept. */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(4) {
        grid-area: date !important;

        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;

        min-height: 98px !important;
        padding-right: 12px !important;

        border-right: 1px solid rgba(255,255,255,.08) !important;

        color: #FFD700 !important;

        font-size: 12px !important;
        font-weight: 600 !important;
        line-height: 1.35 !important;
        text-align: center !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(4)::before {
        content: "DATE / TIME" !important;
        display: block !important;
        margin-bottom: 6px !important;

        color: #888888 !important;
        font-size: 7px !important;
        font-weight: 700 !important;
        letter-spacing: .5px !important;
    }

    /* SERVICE */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(2) {
        grid-area: service !important;

        color: #FFFFFF !important;
        font-size: 15px !important;
        font-weight: 600 !important;
        line-height: 1.22 !important;
        align-self: center !important;
    }

    /* STATUS */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(7) {
        grid-area: status !important;
        align-self: start !important;
        justify-self: end !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table
    .booknetic_appointment_status_all {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        min-height: 24px !important;
        padding: 0 9px !important;

        background: rgba(255,215,0,.10) !important;
        border: 1px solid rgba(255,215,0,.22) !important;
        border-radius: 999px !important;

        font-size: 8px !important;
        font-weight: 700 !important;
        letter-spacing: .25px !important;
        text-transform: uppercase !important;
    }

    /* META LINE: STAFF + PRICE + DURATION + ID */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(3),
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(5),
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(6),
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(1) {
        grid-area: meta !important;
    }

    /* Put the four meta cells into one shared visual row by
       turning the TR into a grid and each cell into compact items. */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(3) {
        grid-column: 2 / 4 !important;
        grid-row: 2 !important;

        display: flex !important;
        align-items: center !important;
        gap: 8px !important;

        padding-top: 2px !important;
        padding-right: 118px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table
    .user_visit_card {
        display: flex !important;
        align-items: center !important;
        gap: 7px !important;
        min-width: 0 !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table
    .circle_image {
        width: 26px !important;
        height: 26px !important;
        min-width: 26px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table
    .user_visit_details span:first-child {
        color: #BEBEBE !important;
        font-size: 10px !important;
        white-space: nowrap !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(5) {
        position: absolute !important;
        right: 14px !important;
        top: 52px !important;

        color: #FFD700 !important;
        font-size: 12px !important;
        font-weight: 700 !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(6) {
        position: absolute !important;
        right: 14px !important;
        top: 74px !important;

        color: #8F8F8F !important;
        font-size: 9px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(1) {
        position: absolute !important;
        left: 14px !important;
        bottom: 10px !important;

        color: #5F5F5F !important;
        font-size: 8px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(1)::before {
        content: "#" !important;
        display: inline !important;
        color: #5F5F5F !important;
    }

    /* ACTIONS */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(8) {
        grid-area: actions !important;
        grid-column: 2 / 4 !important;

        display: flex !important;
        gap: 8px !important;
        padding-top: 3px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(8):empty {
        display: none !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(8) button,
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(8) a {
        flex: 1 1 0 !important;
        min-height: 36px !important;
        margin: 0 !important;
    }


    /* =====================================================
       PACKAGES
       Exact live row:
       1 ID / 2 NAME / 3 PRICE / 4 USAGE+PROGRESS /
       5 DATE / 6 PAY NOW
       ===================================================== */

    body.page-id-1180 #booknetic-tab-packages table {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        overflow: visible !important;
    }

    body.page-id-1180 #booknetic-tab-packages table thead {
        display: none !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
        width: 100% !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody tr {
        position: relative !important;
        display: grid !important;

        grid-template-columns: minmax(0,1fr) auto !important;
        grid-template-areas:
            "name price"
            "usage usage"
            "date date"
            "action action" !important;

        column-gap: 12px !important;
        row-gap: 8px !important;

        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        margin: 0 !important;
        padding: 14px !important;

        background: linear-gradient(145deg, #121212 0%, #080808 100%) !important;
        border: 1px solid #303030 !important;
        border-radius: 7px !important;

        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.02),
            0 8px 20px rgba(0,0,0,.18) !important;

        overflow: hidden !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td {
        display: block !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;

        color: #D8D8D8 !important;
        border: 0 !important;

        font-size: 12px !important;
        line-height: 1.3 !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td::before {
        display: none !important;
        content: none !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(1) {
        position: absolute !important;
        right: 14px !important;
        bottom: 58px !important;

        color: #5F5F5F !important;
        font-size: 8px !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(1)::before {
        content: "PACKAGE #" !important;
        display: inline !important;
        margin-right: 2px !important;
        color: #5F5F5F !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(2) {
        grid-area: name !important;

        color: #FFFFFF !important;
        font-size: 16px !important;
        font-weight: 600 !important;
        line-height: 1.22 !important;
        padding-right: 10px !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(3) {
        grid-area: price !important;
        align-self: start !important;
        justify-self: end !important;

        color: #FFD700 !important;
        font-size: 13px !important;
        font-weight: 700 !important;
        white-space: nowrap !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(4) {
        grid-area: usage !important;

        padding-top: 2px !important;

        color: #C8C8C8 !important;
        font-size: 11px !important;
    }

    body.page-id-1180 #booknetic-tab-packages
    .booknetic-package-progressbar {
        width: 100% !important;
        max-width: 100% !important;
        height: 4px !important;

        margin-top: 7px !important;

        background: #1A1A1A !important;
        border-radius: 999px !important;
        overflow: hidden !important;
    }

    body.page-id-1180 #booknetic-tab-packages
    .booknetic-package-progressbar span {
        display: block !important;
        height: 100% !important;
        background: linear-gradient(90deg,#E6B800 0%,#FFD700 100%) !important;
        border-radius: inherit !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(5) {
        grid-area: date !important;

        padding-top: 1px !important;

        color: #8F8F8F !important;
        font-size: 10px !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(5)::before {
        content: "Purchased " !important;
        display: inline !important;
        color: #666666 !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(6) {
        grid-area: action !important;
        padding-top: 5px !important;
    }

    body.page-id-1180 #booknetic-tab-packages
    .booknetic_pay_package_btn {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;

        width: 100% !important;
        max-width: 100% !important;
        min-height: 40px !important;

        margin: 0 !important;
        padding: 0 14px !important;

        background: transparent !important;
        color: #FFD700 !important;

        border: 1px solid rgba(255,215,0,.72) !important;
        border-radius: 3px !important;

        font-size: 10px !important;
        font-weight: 700 !important;
        letter-spacing: .35px !important;

        box-shadow: inset 0 1px 0 rgba(255,255,255,.02) !important;
    }

    body.page-id-1180 #booknetic-tab-packages
    .booknetic_pay_package_btn i {
        color: #FFD700 !important;
        font-size: 11px !important;
    }

    body.page-id-1180 #booknetic-tab-packages
    .booknetic_pay_package_btn:hover,
    body.page-id-1180 #booknetic-tab-packages
    .booknetic_pay_package_btn:focus {
        background: linear-gradient(180deg,#FFE66A 0%,#FFD700 50%,#E6B800 100%) !important;
        color: #050505 !important;
        border-color: #FFD700 !important;
    }

    body.page-id-1180 #booknetic-tab-packages
    .booknetic_pay_package_btn:hover i,
    body.page-id-1180 #booknetic-tab-packages
    .booknetic_pay_package_btn:focus i {
        color: #050505 !important;
    }


    /* =====================================================
       REAL PAY NOW POPUP
       Exact wrapper supplied:
       .booknetic_popup_body
         .booknetic_packages_pay_now_popup_body
         .booknetic_reschedule_popup_footer
       ===================================================== */

    body.page-id-1180 .booknetic_popup_body:has(.booknetic_packages_pay_now_popup_body) {
        position: fixed !important;

        left: 50% !important;
        top: 50% !important;
        transform: translate(-50%,-50%) !important;

        width: min(360px, calc(100vw - 28px)) !important;
        max-width: calc(100vw - 28px) !important;
        min-width: 0 !important;

        max-height: calc(100dvh - 40px) !important;

        margin: 0 !important;
        padding: 0 !important;

        background: linear-gradient(180deg,#151515 0%,#080808 100%) !important;
        color: #FFFFFF !important;

        border: 1px solid rgba(255,215,0,.62) !important;
        border-radius: 6px !important;

        box-shadow:
            0 28px 80px rgba(0,0,0,.82),
            0 0 0 1px rgba(255,215,0,.04) !important;

        overflow: hidden !important;
        z-index: 999999 !important;
    }

    body.page-id-1180 .booknetic_popup_body:has(.booknetic_packages_pay_now_popup_body) *,
    body.page-id-1180 .booknetic_popup_body:has(.booknetic_packages_pay_now_popup_body) *::before,
    body.page-id-1180 .booknetic_popup_body:has(.booknetic_packages_pay_now_popup_body) *::after {
        box-sizing: border-box !important;
    }

    body.page-id-1180
    .booknetic_popup_body:has(.booknetic_packages_pay_now_popup_body)
    .booknetic_packages_pay_now_popup_body {
        padding: 18px 16px 16px !important;
        background: transparent !important;
    }

    body.page-id-1180
    .booknetic_popup_body:has(.booknetic_packages_pay_now_popup_body)
    .form-row,
    body.page-id-1180
    .booknetic_popup_body:has(.booknetic_packages_pay_now_popup_body)
    .form-group {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    body.page-id-1180
    .booknetic_popup_body:has(.booknetic_packages_pay_now_popup_body)
    label {
        display: block !important;
        margin: 0 0 8px !important;

        color: #AFAFAF !important;
        font-size: 9px !important;
        font-weight: 700 !important;
        letter-spacing: .45px !important;
        text-transform: uppercase !important;
    }

    /* Hide the original select; Select2 is the visible control. */
    body.page-id-1180
    .booknetic_popup_body:has(.booknetic_packages_pay_now_popup_body)
    select.booknetic_packages_pay_now_popup_select {
        display: none !important;
    }

    body.page-id-1180
    .booknetic_popup_body:has(.booknetic_packages_pay_now_popup_body)
    .select2-container {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    body.page-id-1180
    .booknetic_popup_body:has(.booknetic_packages_pay_now_popup_body)
    .select2-selection--single {
        display: flex !important;
        align-items: center !important;

        width: 100% !important;
        height: 42px !important;

        background: #0A0A0A !important;
        border: 1px solid #3B3B3B !important;
        border-radius: 2px !important;

        box-shadow: none !important;
    }

    body.page-id-1180
    .booknetic_popup_body:has(.booknetic_packages_pay_now_popup_body)
    .select2-selection__rendered {
        width: 100% !important;
        padding: 0 42px 0 12px !important;

        color: #FFFFFF !important;
        font-size: 16px !important;
        line-height: 40px !important;
    }

    body.page-id-1180
    .booknetic_popup_body:has(.booknetic_packages_pay_now_popup_body)
    .select2-selection__arrow {
        height: 40px !important;
        width: 36px !important;
        right: 0 !important;
    }

    body.page-id-1180
    .booknetic_popup_body:has(.booknetic_packages_pay_now_popup_body)
    .booknetic_reschedule_popup_footer {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 10px !important;

        width: 100% !important;

        margin: 0 !important;
        padding: 14px 16px 16px !important;

        background: #090909 !important;
        border-top: 1px solid rgba(255,215,0,.16) !important;
    }

    body.page-id-1180
    .booknetic_popup_body:has(.booknetic_packages_pay_now_popup_body)
    .booknetic_reschedule_popup_footer button {
        width: 100% !important;
        min-width: 0 !important;
        height: 40px !important;
        margin: 0 !important;
        padding: 0 12px !important;

        border-radius: 3px !important;

        font-size: 10px !important;
        font-weight: 700 !important;
        letter-spacing: .35px !important;
    }

    body.page-id-1180
    .booknetic_popup_body:has(.booknetic_packages_pay_now_popup_body)
    .booknetic_pay_now_popup_cancel {
        background: linear-gradient(180deg,#151515 0%,#090909 100%) !important;
        color: #EAEAEA !important;
        border: 1px solid rgba(255,215,0,.42) !important;
    }

    body.page-id-1180
    .booknetic_popup_body:has(.booknetic_packages_pay_now_popup_body)
    .booknetic_packages_pay_now_popup_confirm {
        background: linear-gradient(180deg,#FFE66A 0%,#FFD700 50%,#E6B800 100%) !important;
        color: #050505 !important;
        border: 1px solid #FFD700 !important;
    }
}


/* =========================================================
   SMALL PHONES — V10
   ========================================================= */

@media only screen and (max-width: 480px) {

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody tr {
        grid-template-columns: 68px minmax(0,1fr) auto !important;
        column-gap: 10px !important;
        padding: 12px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(4) {
        min-height: 90px !important;
        padding-right: 10px !important;
        font-size: 11px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(2) {
        font-size: 14px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(5) {
        right: 12px !important;
        top: 50px !important;
        font-size: 11px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(6) {
        right: 12px !important;
        top: 70px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(3) {
        padding-right: 100px !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(2) {
        font-size: 15px !important;
    }

    body.page-id-1180 .booknetic_popup_body:has(.booknetic_packages_pay_now_popup_body) {
        width: calc(100vw - 20px) !important;
        max-width: calc(100vw - 20px) !important;
    }
}

/* =========================================================
   MOBILE CUSTOMER ACCOUNT — V11
   Cleaner concept-style cards + true Pay Now modal overlay
   ========================================================= */

@media only screen and (max-width: 1000px) {

    /* =====================================================
       APPOINTMENTS — cleaner / flatter / closer to concept
       ===================================================== */

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody tr {
        grid-template-columns: 64px minmax(0,1fr) auto !important;
        grid-template-areas:
            "date service status"
            "date meta meta"
            "date actions actions" !important;

        column-gap: 12px !important;
        row-gap: 5px !important;

        padding: 12px !important;

        background: linear-gradient(145deg,#121212 0%,#090909 100%) !important;
        border: 1px solid #2D2D2D !important;
        border-radius: 6px !important;

        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.018),
            0 7px 18px rgba(0,0,0,.16) !important;
    }

    /* Remove the vertical gold bar from previous versions. */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody tr::before {
        content: none !important;
        display: none !important;
    }

    /* Date/time block */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(4) {
        min-height: 82px !important;
        padding: 0 10px 0 0 !important;

        border-right: 1px solid rgba(255,255,255,.08) !important;

        color: #FFD700 !important;
        font-size: 11px !important;
        line-height: 1.35 !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(4)::before {
        margin-bottom: 4px !important;
        font-size: 6.5px !important;
        letter-spacing: .45px !important;
    }

    /* Service is the main heading */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(2) {
        font-size: 16px !important;
        line-height: 1.18 !important;
        font-weight: 600 !important;
        padding-right: 6px !important;
        color: #FFFFFF !important;
    }

    /* Status pill */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(7) {
        margin-left: 6px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table
    .booknetic_appointment_status_all {
        min-height: 22px !important;
        padding: 0 8px !important;

        background: rgba(255,215,0,.08) !important;
        border: 1px solid rgba(255,215,0,.28) !important;
        border-radius: 999px !important;

        font-size: 7px !important;
        line-height: 1 !important;
    }

    /* Hide staff image completely */
    body.page-id-1180 #booknetic_customer_panel_appointments_table .circle_image,
    body.page-id-1180 #booknetic_customer_panel_appointments_table .user_visit_card .circle_image {
        display: none !important;
    }

    /* Staff line becomes simple muted text */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(3) {
        grid-column: 2 / 4 !important;
        grid-row: 2 !important;

        display: flex !important;
        align-items: center !important;

        padding: 1px 96px 0 0 !important;
        min-height: 20px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table .user_visit_card {
        display: block !important;
        min-width: 0 !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table .user_visit_details span:first-child {
        color: #AFAFAF !important;
        font-size: 10px !important;
        line-height: 1.2 !important;
        font-weight: 400 !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table .user_visit_details span:first-child::before {
        content: "Staff · " !important;
        color: #666666 !important;
    }

    /* Price + duration form one compact right-hand metadata block */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(5) {
        right: 12px !important;
        top: 47px !important;

        color: #FFD700 !important;
        font-size: 11px !important;
        line-height: 1 !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(6) {
        right: 12px !important;
        top: 66px !important;

        color: #888888 !important;
        font-size: 8.5px !important;
        line-height: 1 !important;
    }

    /* Hide appointment ID for mobile */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(1) {
        display: none !important;
    }

    /* Action area */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(8) {
        grid-column: 2 / 4 !important;
        padding-top: 4px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(8) button,
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(8) a {
        min-height: 34px !important;
        font-size: 9px !important;
    }


    /* =====================================================
       PACKAGES — flatter concept-style card
       ===================================================== */

    body.page-id-1180 #booknetic-tab-packages table tbody tr {
        grid-template-columns: minmax(0,1fr) auto !important;
        grid-template-areas:
            "name price"
            "usage usage"
            "date date"
            "action action" !important;

        row-gap: 7px !important;
        column-gap: 10px !important;

        padding: 12px !important;

        background: linear-gradient(145deg,#121212 0%,#090909 100%) !important;
        border: 1px solid #2D2D2D !important;
        border-radius: 6px !important;

        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.018),
            0 7px 18px rgba(0,0,0,.16) !important;
    }

    /* Remove gold side bar */
    body.page-id-1180 #booknetic-tab-packages table tbody tr::before {
        content: none !important;
        display: none !important;
    }

    /* Hide package ID */
    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(1) {
        display: none !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(2) {
        font-size: 16px !important;
        line-height: 1.2 !important;
        padding: 0 !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(3) {
        font-size: 12px !important;
        line-height: 1 !important;
        white-space: nowrap !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(4) {
        font-size: 10.5px !important;
        color: #B8B8B8 !important;
        padding-top: 2px !important;
    }

    body.page-id-1180 #booknetic-tab-packages .booknetic-package-progressbar {
        height: 3px !important;
        margin-top: 6px !important;
        background: #1B1B1B !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(5) {
        font-size: 9px !important;
        color: #777777 !important;
    }

    body.page-id-1180 #booknetic-tab-packages .booknetic_pay_package_btn {
        min-height: 36px !important;
        height: 36px !important;

        background: transparent !important;
        border: 1px solid rgba(255,215,0,.68) !important;

        color: #FFD700 !important;

        font-size: 9px !important;
        letter-spacing: .3px !important;
    }


    /* =====================================================
       PAY NOW — TRUE OVERLAY
       Exact live parent:
       #booknetic_packages_pay_now_popup.booknetic_popup
       ===================================================== */

    body.page-id-1180 #booknetic_packages_pay_now_popup.booknetic_popup {
        position: fixed !important;

        inset: 0 !important;

        width: 100vw !important;
        max-width: 100vw !important;
        min-width: 100vw !important;

        height: 100dvh !important;
        max-height: 100dvh !important;
        min-height: 100dvh !important;

        margin: 0 !important;
        padding: 18px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        background: rgba(0,0,0,.78) !important;

        overflow: hidden !important;
        z-index: 9999999 !important;

        transform: none !important;
    }

    /* Hidden popup must not remain visible. */
    body.page-id-1180 #booknetic_packages_pay_now_popup.booknetic_popup[style*="display: none"],
    body.page-id-1180 #booknetic_packages_pay_now_popup.booknetic_popup.booknetic_hidden {
        display: none !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup.booknetic_popup
    > .booknetic_popup_body {
        position: relative !important;

        left: auto !important;
        right: auto !important;
        top: auto !important;
        bottom: auto !important;

        transform: none !important;

        width: min(360px, calc(100vw - 36px)) !important;
        max-width: calc(100vw - 36px) !important;
        min-width: 0 !important;

        height: auto !important;
        min-height: 0 !important;
        max-height: calc(100dvh - 44px) !important;

        margin: 0 !important;
        padding: 0 !important;

        background: linear-gradient(180deg,#151515 0%,#090909 100%) !important;

        border: 1px solid rgba(255,215,0,.60) !important;
        border-radius: 6px !important;

        box-shadow:
            0 28px 80px rgba(0,0,0,.85),
            0 0 0 1px rgba(255,215,0,.035) !important;

        overflow: hidden !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_packages_pay_now_popup_body {
        padding: 18px 16px 16px !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_packages_pay_now_popup_body::before {
        content: "PAY FOR PACKAGE" !important;
        display: block !important;

        margin: 0 0 15px !important;
        padding: 0 0 11px !important;

        color: #FFFFFF !important;
        border-bottom: 1px solid rgba(255,215,0,.20) !important;

        font-family: Helvetica,Arial,sans-serif !important;
        font-size: 17px !important;
        font-weight: 500 !important;
        line-height: 1.1 !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    label {
        margin: 0 0 7px !important;

        color: #8E8E8E !important;

        font-size: 8px !important;
        font-weight: 700 !important;
        letter-spacing: .5px !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .select2-container {
        width: 100% !important;
        max-width: 100% !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .select2-selection--single {
        width: 100% !important;
        height: 42px !important;

        background: #0A0A0A !important;

        border: 1px solid #343434 !important;
        border-radius: 2px !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .select2-selection__rendered {
        color: #FFFFFF !important;
        font-size: 16px !important;
        line-height: 40px !important;
        padding: 0 40px 0 12px !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_reschedule_popup_footer {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 9px !important;

        width: 100% !important;

        padding: 12px 16px 16px !important;
        margin: 0 !important;

        background: #090909 !important;

        border-top: 1px solid rgba(255,215,0,.15) !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_reschedule_popup_footer button {
        width: 100% !important;
        min-width: 0 !important;
        height: 39px !important;

        margin: 0 !important;

        border-radius: 3px !important;

        font-size: 10px !important;
        font-weight: 700 !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_pay_now_popup_cancel {
        background: linear-gradient(180deg,#151515 0%,#090909 100%) !important;
        color: #E5E5E5 !important;

        border: 1px solid rgba(255,215,0,.40) !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_packages_pay_now_popup_confirm {
        background: linear-gradient(180deg,#FFE66A 0%,#FFD700 50%,#E6B800 100%) !important;
        color: #050505 !important;

        border: 1px solid #FFD700 !important;
    }
}

@media only screen and (max-width: 480px) {

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody tr {
        grid-template-columns: 60px minmax(0,1fr) auto !important;
        column-gap: 9px !important;
        padding: 11px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(2) {
        font-size: 14px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(3) {
        padding-right: 88px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(5) {
        right: 11px !important;
        top: 45px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(6) {
        right: 11px !important;
        top: 63px !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(2) {
        font-size: 14px !important;
    }

    body.page-id-1180 #booknetic_packages_pay_now_popup.booknetic_popup {
        padding: 10px !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup.booknetic_popup
    > .booknetic_popup_body {
        width: calc(100vw - 20px) !important;
        max-width: calc(100vw - 20px) !important;
        max-height: calc(100dvh - 20px) !important;
    }
}

/* =========================================================
   MOBILE CUSTOMER ACCOUNT — V12
   CARD CLEANUP ONLY
   Pay Now popup intentionally left alone for now.
   ========================================================= */

@media only screen and (max-width: 1000px) {

    /* =====================================================
       APPOINTMENTS — clean concept layout
       ===================================================== */

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody {
        gap: 10px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody tr {
        display: grid !important;

        grid-template-columns: 66px minmax(0, 1fr) auto !important;
        grid-template-areas:
            "date service status"
            "date staff staff"
            "date details details"
            "actions actions actions" !important;

        column-gap: 12px !important;
        row-gap: 5px !important;

        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        min-height: 0 !important;
        height: auto !important;

        padding: 13px !important;

        background: linear-gradient(145deg, #111111 0%, #080808 100%) !important;
        border: 1px solid #2D2D2D !important;
        border-radius: 6px !important;

        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.02),
            0 7px 18px rgba(0,0,0,.16) !important;

        overflow: hidden !important;
    }

    /* Remove all inherited desktop cell boxes */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td,
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td > div,
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td > span {
        min-height: 0 !important;
        height: auto !important;

        background: transparent !important;
        box-shadow: none !important;

        border: 0 !important;
        border-radius: 0 !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td {
        position: static !important;

        display: block !important;

        width: auto !important;
        min-width: 0 !important;
        max-width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;

        white-space: normal !important;
        overflow: visible !important;
    }

    /* ID hidden */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(1) {
        display: none !important;
    }

    /* DATE / TIME */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(4) {
        grid-area: date !important;

        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;

        min-height: 92px !important;

        padding: 0 10px 0 0 !important;

        border-right: 1px solid rgba(255,255,255,.08) !important;

        color: #FFD700 !important;
        font-size: 11px !important;
        font-weight: 600 !important;
        line-height: 1.35 !important;
        text-align: center !important;

        overflow-wrap: anywhere !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(4)::before {
        content: "DATE / TIME" !important;
        display: block !important;

        margin: 0 0 5px !important;

        color: #777777 !important;
        font-size: 6.5px !important;
        font-weight: 700 !important;
        letter-spacing: .45px !important;
    }

    /* SERVICE */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(2) {
        grid-area: service !important;

        align-self: center !important;

        color: #FFFFFF !important;
        font-size: 16px !important;
        font-weight: 600 !important;
        line-height: 1.16 !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(2)::before {
        content: "SERVICE" !important;
        display: block !important;

        margin: 0 0 4px !important;

        color: #FFD700 !important;
        font-size: 7px !important;
        font-weight: 700 !important;
        letter-spacing: .5px !important;
    }

    /* STATUS */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(7) {
        grid-area: status !important;

        align-self: start !important;
        justify-self: end !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table
    .booknetic_appointment_status_all {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        min-height: 22px !important;
        padding: 0 9px !important;

        background: rgba(255,215,0,.08) !important;
        border: 1px solid rgba(255,215,0,.30) !important;
        border-radius: 999px !important;

        font-size: 7px !important;
        font-weight: 700 !important;
        line-height: 1 !important;
        letter-spacing: .25px !important;
        text-transform: uppercase !important;
    }

    /* STAFF — no image */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(3) {
        grid-area: staff !important;

        display: block !important;
        padding-top: 1px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table .circle_image,
    body.page-id-1180 #booknetic_customer_panel_appointments_table .user_visit_card .circle_image {
        display: none !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table .user_visit_card {
        display: block !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table .user_visit_details {
        display: block !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table .user_visit_details span {
        display: none !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table .user_visit_details span:first-child {
        display: inline !important;

        color: #AFAFAF !important;
        font-size: 10px !important;
        font-weight: 400 !important;
        line-height: 1.2 !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table .user_visit_details span:first-child::before {
        content: "Damian Philpott" !important;
        font-size: 0 !important;
    }

    /* DETAILS: price + duration on one neat line */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(5) {
        grid-area: details !important;

        display: inline-block !important;

        color: #FFD700 !important;
        font-size: 12px !important;
        font-weight: 700 !important;
        line-height: 1.2 !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(6) {
        grid-area: details !important;

        display: inline-block !important;
        justify-self: end !important;

        color: #888888 !important;
        font-size: 9px !important;
        line-height: 1.2 !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(6)::before {
        content: "Duration · " !important;
        display: inline !important;
        color: #666666 !important;
    }

    /* ACTIONS — only show if there is a real control */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(8) {
        grid-area: actions !important;

        display: flex !important;
        gap: 8px !important;

        padding-top: 5px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(8):not(:has(button, a)) {
        display: none !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(8) button,
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(8) a {
        flex: 1 1 0 !important;
        min-height: 34px !important;
        margin: 0 !important;
        font-size: 9px !important;
    }


    /* =====================================================
       PACKAGES — clean concept layout
       ===================================================== */

    body.page-id-1180 #booknetic-tab-packages table tbody {
        gap: 10px !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody tr {
        display: grid !important;

        grid-template-columns: minmax(0,1fr) auto !important;
        grid-template-areas:
            "name price"
            "usage usage"
            "date date"
            "action action" !important;

        column-gap: 10px !important;
        row-gap: 7px !important;

        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        min-height: 0 !important;
        height: auto !important;

        padding: 13px !important;

        background: linear-gradient(145deg, #111111 0%, #080808 100%) !important;
        border: 1px solid #2D2D2D !important;
        border-radius: 6px !important;

        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.02),
            0 7px 18px rgba(0,0,0,.16) !important;

        overflow: hidden !important;
    }

    /* Strip old desktop/table cell panels */
    body.page-id-1180 #booknetic-tab-packages table tbody td,
    body.page-id-1180 #booknetic-tab-packages table tbody td > div,
    body.page-id-1180 #booknetic-tab-packages table tbody td > span {
        min-height: 0 !important;
        height: auto !important;

        background: transparent !important;
        box-shadow: none !important;

        border: 0 !important;
        border-radius: 0 !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td {
        position: static !important;

        display: block !important;

        width: auto !important;
        min-width: 0 !important;
        max-width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;

        white-space: normal !important;
        overflow: visible !important;
    }

    /* ID hidden */
    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(1) {
        display: none !important;
    }

    /* NAME */
    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(2) {
        grid-area: name !important;

        color: #FFFFFF !important;
        font-size: 16px !important;
        font-weight: 600 !important;
        line-height: 1.18 !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(2)::before {
        content: "PACKAGE" !important;
        display: block !important;

        margin: 0 0 4px !important;

        color: #FFD700 !important;
        font-size: 7px !important;
        font-weight: 700 !important;
        letter-spacing: .5px !important;
    }

    /* PRICE */
    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(3) {
        grid-area: price !important;

        justify-self: end !important;
        align-self: start !important;

        color: #FFD700 !important;
        font-size: 12px !important;
        font-weight: 700 !important;
        line-height: 1.1 !important;
        white-space: nowrap !important;
    }

    /* USAGE */
    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(4) {
        grid-area: usage !important;

        color: #BEBEBE !important;
        font-size: 10.5px !important;
        line-height: 1.25 !important;
    }

    body.page-id-1180 #booknetic-tab-packages .booknetic-package-progressbar {
        width: 100% !important;
        max-width: 100% !important;
        height: 3px !important;

        margin: 6px 0 0 !important;

        background: #1A1A1A !important;
        border-radius: 999px !important;
        overflow: hidden !important;
    }

    body.page-id-1180 #booknetic-tab-packages .booknetic-package-progressbar span {
        display: block !important;
        height: 100% !important;
        background: #FFD700 !important;
        border-radius: inherit !important;
    }

    /* DATE */
    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(5) {
        grid-area: date !important;

        color: #777777 !important;
        font-size: 9px !important;
        line-height: 1.2 !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(5)::before {
        content: "Purchased · " !important;
        display: inline !important;
        color: #666666 !important;
    }

    /* ACTION */
    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(6) {
        grid-area: action !important;

        padding-top: 4px !important;
    }

    body.page-id-1180 #booknetic-tab-packages .booknetic_pay_package_btn {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 7px !important;

        width: 100% !important;
        max-width: 100% !important;
        min-height: 36px !important;

        margin: 0 !important;
        padding: 0 12px !important;

        background: transparent !important;
        color: #FFD700 !important;

        border: 1px solid rgba(255,215,0,.68) !important;
        border-radius: 3px !important;

        font-size: 9px !important;
        font-weight: 700 !important;
        letter-spacing: .3px !important;
    }
}

@media only screen and (max-width: 480px) {

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody tr {
        grid-template-columns: 58px minmax(0,1fr) auto !important;
        column-gap: 9px !important;
        padding: 11px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(4) {
        min-height: 86px !important;
        padding-right: 8px !important;
        font-size: 10.5px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(2),
    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(2) {
        font-size: 14px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(3) {
        font-size: 9.5px !important;
    }
}

/* =========================================================
   MOBILE CUSTOMER ACCOUNT — V13
   Readability + use the dead space beside the collapsed rail
   Cards only. Pay Now remains untouched.
   ========================================================= */

@media only screen and (max-width: 1000px) {

    /* Pull the mobile card lists left into the unused space.
       The sidebar remains above them, so navigation is unchanged. */
    body.page-id-1180 #booknetic_customer_panel_appointments_table,
    body.page-id-1180 #booknetic-tab-packages table {
        width: calc(100% + 48px) !important;
        max-width: calc(100% + 48px) !important;
        margin-left: -48px !important;
        margin-right: 0 !important;
    }

    /* Give the cards a little breathing room from the rail. */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody,
    body.page-id-1180 #booknetic-tab-packages table tbody {
        padding-left: 8px !important;
        padding-right: 0 !important;
    }


    /* =====================================================
       APPOINTMENTS — clearer hierarchy
       ===================================================== */

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody tr {
        grid-template-columns: 72px minmax(0,1fr) auto !important;
        grid-template-areas:
            "date service status"
            "date staff staff"
            "date price duration"
            "actions actions actions" !important;

        column-gap: 13px !important;
        row-gap: 7px !important;

        padding: 14px !important;
        border-radius: 6px !important;
    }

    /* Date block */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(4) {
        grid-area: date !important;

        min-height: 96px !important;
        padding-right: 12px !important;

        color: #FFD700 !important;
        font-size: 12.5px !important;
        font-weight: 700 !important;
        line-height: 1.36 !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(4)::before {
        margin-bottom: 6px !important;

        color: #929292 !important;
        font-size: 7.5px !important;
        letter-spacing: .45px !important;
    }

    /* Main service heading */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(2) {
        grid-area: service !important;

        color: #FFFFFF !important;
        font-size: 17px !important;
        font-weight: 600 !important;
        line-height: 1.16 !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(2)::before {
        margin-bottom: 5px !important;

        color: #FFD700 !important;
        font-size: 7.5px !important;
    }

    /* Status pill */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(7) {
        grid-area: status !important;
        align-self: start !important;
        justify-self: end !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table
    .booknetic_appointment_status_all {
        min-height: 24px !important;
        padding: 0 10px !important;

        font-size: 7.5px !important;
    }

    /* Staff */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(3) {
        grid-area: staff !important;
        padding-top: 1px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table
    .user_visit_details span:first-child {
        color: #BDBDBD !important;
        font-size: 11.5px !important;
        line-height: 1.25 !important;
    }

    /* Price */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(5) {
        grid-area: price !important;

        position: static !important;
        justify-self: start !important;

        color: #FFD700 !important;
        font-size: 13.5px !important;
        font-weight: 700 !important;
        line-height: 1.2 !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(5)::before {
        content: "PRICE · " !important;
        display: inline !important;

        color: #777777 !important;
        font-size: 7px !important;
        font-weight: 700 !important;
        letter-spacing: .35px !important;
    }

    /* Duration */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(6) {
        grid-area: duration !important;

        position: static !important;
        justify-self: end !important;
        align-self: center !important;

        color: #9A9A9A !important;
        font-size: 10.5px !important;
        line-height: 1.2 !important;
        white-space: nowrap !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(6)::before {
        content: "DURATION · " !important;
        display: inline !important;

        color: #666666 !important;
        font-size: 7px !important;
        font-weight: 700 !important;
        letter-spacing: .3px !important;
    }

    /* Real appointment actions */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(8) {
        grid-area: actions !important;
        padding-top: 5px !important;
    }


    /* =====================================================
       PACKAGES — same wider/readable treatment
       ===================================================== */

    body.page-id-1180 #booknetic-tab-packages table tbody tr {
        padding: 14px !important;
        row-gap: 8px !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(2) {
        font-size: 17px !important;
        line-height: 1.18 !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(2)::before {
        font-size: 7.5px !important;
        margin-bottom: 5px !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(3) {
        font-size: 13px !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(4) {
        font-size: 11.5px !important;
        line-height: 1.3 !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(5) {
        font-size: 10px !important;
    }

    body.page-id-1180 #booknetic-tab-packages .booknetic_pay_package_btn {
        min-height: 38px !important;
        font-size: 10px !important;
    }
}


@media only screen and (max-width: 480px) {

    body.page-id-1180 #booknetic_customer_panel_appointments_table,
    body.page-id-1180 #booknetic-tab-packages table {
        width: calc(100% + 44px) !important;
        max-width: calc(100% + 44px) !important;
        margin-left: -44px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody tr {
        grid-template-columns: 68px minmax(0,1fr) auto !important;
        column-gap: 10px !important;
        padding: 12px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(4) {
        min-height: 92px !important;
        padding-right: 9px !important;
        font-size: 12px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(2),
    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(2) {
        font-size: 16px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table
    .user_visit_details span:first-child {
        font-size: 11px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(5) {
        font-size: 12.5px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(6) {
        font-size: 10px !important;
    }
}

/* =========================================================
   MOBILE CUSTOMER ACCOUNT — V14
   Fix clipped left edge + improve readability
   Cards only. Pay Now remains untouched.
   ========================================================= */

@media only screen and (max-width: 1000px) {

    /* The previous negative offset pulled the cards too far left.
       Keep them closer to the rail without clipping content. */
    body.page-id-1180 #booknetic_customer_panel_appointments_table,
    body.page-id-1180 #booknetic-tab-packages table {
        width: calc(100% + 28px) !important;
        max-width: calc(100% + 28px) !important;
        margin-left: -28px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody,
    body.page-id-1180 #booknetic-tab-packages table tbody {
        padding-left: 10px !important;
    }

    /* Appointment card proportions */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody tr {
        grid-template-columns: 76px minmax(0,1fr) auto !important;
        column-gap: 14px !important;
        row-gap: 8px !important;
        padding: 14px !important;
    }

    /* DATE / TIME */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(4) {
        min-height: 98px !important;
        padding-right: 12px !important;

        font-size: 14px !important;
        line-height: 1.38 !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(4)::before {
        font-size: 8.5px !important;
        margin-bottom: 6px !important;
    }

    /* Keep service as-is */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(2) {
        font-size: 17px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(2)::before {
        font-size: 8px !important;
    }

    /* STATUS */
    body.page-id-1180 #booknetic_customer_panel_appointments_table
    .booknetic_appointment_status_all {
        min-height: 26px !important;
        padding: 0 11px !important;
        font-size: 8.5px !important;
    }

    /* STAFF */
    body.page-id-1180 #booknetic_customer_panel_appointments_table
    .user_visit_details span:first-child {
        font-size: 13px !important;
        line-height: 1.28 !important;
        color: #C5C5C5 !important;
    }

    /* PRICE */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(5) {
        font-size: 15px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(5)::before {
        font-size: 8px !important;
    }

    /* DURATION */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(6) {
        font-size: 12px !important;
        color: #AAAAAA !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(6)::before {
        font-size: 8px !important;
    }

    /* PACKAGES */
    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(2)::before {
        font-size: 8px !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(3) {
        font-size: 14px !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(4) {
        font-size: 13px !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(5) {
        font-size: 11.5px !important;
    }

    body.page-id-1180 #booknetic-tab-packages .booknetic_pay_package_btn {
        font-size: 11px !important;
    }
}

@media only screen and (max-width: 480px) {

    body.page-id-1180 #booknetic_customer_panel_appointments_table,
    body.page-id-1180 #booknetic-tab-packages table {
        width: calc(100% + 22px) !important;
        max-width: calc(100% + 22px) !important;
        margin-left: -22px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody tr {
        grid-template-columns: 72px minmax(0,1fr) auto !important;
        column-gap: 11px !important;
        padding: 12px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(4) {
        font-size: 13px !important;
        padding-right: 9px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table
    .user_visit_details span:first-child {
        font-size: 12.5px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(5) {
        font-size: 14px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(6) {
        font-size: 11.5px !important;
    }
}

/* =========================================================
   MOBILE CUSTOMER ACCOUNT — V15
   Reduce left black rail properly at wrapper level.
   No negative card offsets.
   ========================================================= */

@media only screen and (max-width: 1000px) {

    /* Narrow collapsed sidebar */
    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tabs {
        width: 46px !important;
        min-width: 46px !important;
        max-width: 46px !important;
        padding-left: 4px !important;
        padding-right: 4px !important;
    }

    /* Smaller controls inside the narrower rail */
    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-sidebar-toggle,
    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tabs .booknetic-cp-tab-item {
        width: 38px !important;
        min-width: 38px !important;
        max-width: 38px !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-sidebar-toggle {
        height: 34px !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tabs .booknetic-cp-tab-item {
        height: 43px !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    /* Content begins immediately after the rail */
    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab-wrapper {
        width: calc(100% - 46px) !important;
        max-width: calc(100% - 46px) !important;
        margin-left: 46px !important;
    }

    /* Remove the old negative-margin trick completely */
    body.page-id-1180 #booknetic_customer_panel_appointments_table,
    body.page-id-1180 #booknetic-tab-packages table {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody,
    body.page-id-1180 #booknetic-tab-packages table tbody {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* Reduce tab-body side padding so cards use more width */
    body.page-id-1180 #booknetic-tab-appointments .booknetic-cp-tab-body,
    body.page-id-1180 #booknetic-tab-packages .booknetic-cp-tab-body {
        padding-left: 5px !important;
        padding-right: 5px !important;
    }
}

@media only screen and (max-width: 480px) {

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tabs {
        width: 44px !important;
        min-width: 44px !important;
        max-width: 44px !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab-wrapper {
        width: calc(100% - 44px) !important;
        max-width: calc(100% - 44px) !important;
        margin-left: 44px !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-sidebar-toggle,
    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tabs .booknetic-cp-tab-item {
        width: 36px !important;
        min-width: 36px !important;
        max-width: 36px !important;
    }
}

/* =========================================================
   MOBILE CUSTOMER ACCOUNT — V16
   Wider appointment/package cards
   ========================================================= */

@media only screen and (max-width: 1000px) {

    /* Use more of the content width without moving under the sidebar */
    body.page-id-1180 #booknetic-tab-appointments .booknetic-cp-tab-body,
    body.page-id-1180 #booknetic-tab-packages .booknetic-cp-tab-body {
        padding-left: 2px !important;
        padding-right: 2px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table,
    body.page-id-1180 #booknetic-tab-packages table {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody,
    body.page-id-1180 #booknetic-tab-packages table tbody {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
    }

    /* Wider card footprint */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody tr,
    body.page-id-1180 #booknetic-tab-packages table tbody tr {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    /* Appointment layout: give service more room */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody tr {
        grid-template-columns: 72px minmax(0,1fr) auto !important;
        column-gap: 12px !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(2) {
        min-width: 0 !important;
        max-width: none !important;
        white-space: normal !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
    }

    /* Prevent awkward mid-word breaks like "Retou / ch" */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(2),
    body.page-id-1180 #booknetic_customer_panel_appointments_table
    .user_visit_details span:first-child {
        hyphens: none !important;
        -webkit-hyphens: none !important;
    }

    /* Let status take only what it needs */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(7) {
        max-width: max-content !important;
    }
}

@media only screen and (max-width: 480px) {

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab-wrapper {
        width: calc(100% - 42px) !important;
        max-width: calc(100% - 42px) !important;
        margin-left: 42px !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tabs {
        width: 42px !important;
        min-width: 42px !important;
        max-width: 42px !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-sidebar-toggle,
    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tabs .booknetic-cp-tab-item {
        width: 34px !important;
        min-width: 34px !important;
        max-width: 34px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody tr {
        grid-template-columns: 68px minmax(0,1fr) auto !important;
        column-gap: 10px !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
}

/* =========================================================
   MOBILE CUSTOMER ACCOUNT — V17
   Wider cards by reducing collapsed rail footprint.
   No overlap, no clipping, larger readable metadata.
   ========================================================= */

@media only screen and (max-width: 1000px) {

    /* Narrow collapsed rail */
    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tabs {
        width: 40px !important;
        min-width: 40px !important;
        max-width: 40px !important;

        padding-left: 3px !important;
        padding-right: 3px !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-sidebar-toggle,
    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tabs .booknetic-cp-tab-item {
        width: 34px !important;
        min-width: 34px !important;
        max-width: 34px !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-sidebar-toggle {
        height: 34px !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tabs .booknetic-cp-tab-item {
        height: 42px !important;
        padding-left: 9px !important;
        padding-right: 9px !important;
    }

    /* Give the content the freed width */
    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab-wrapper {
        width: calc(100% - 40px) !important;
        max-width: calc(100% - 40px) !important;
        margin-left: 40px !important;
    }

    body.page-id-1180 #booknetic-tab-appointments .booknetic-cp-tab-body,
    body.page-id-1180 #booknetic-tab-packages .booknetic-cp-tab-body {
        padding-left: 1px !important;
        padding-right: 1px !important;
    }

    /* Cards use essentially the full remaining viewport */
    body.page-id-1180 #booknetic_customer_panel_appointments_table,
    body.page-id-1180 #booknetic-tab-packages table,
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody,
    body.page-id-1180 #booknetic-tab-packages table tbody {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* Appointment card width + readable proportions */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody tr {
        width: 100% !important;
        max-width: 100% !important;

        grid-template-columns: 78px minmax(0,1fr) auto !important;
        column-gap: 14px !important;
        row-gap: 8px !important;

        padding: 14px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(4) {
        min-height: 100px !important;
        padding-right: 12px !important;

        font-size: 14px !important;
        line-height: 1.4 !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(4)::before {
        font-size: 8.5px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(2) {
        font-size: 18px !important;
        line-height: 1.15 !important;

        word-break: normal !important;
        overflow-wrap: normal !important;
        hyphens: none !important;
        -webkit-hyphens: none !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table
    .user_visit_details span:first-child {
        font-size: 13.5px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(5) {
        font-size: 15.5px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(6) {
        font-size: 12.5px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table
    .booknetic_appointment_status_all {
        min-height: 26px !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
        font-size: 8.5px !important;
    }

    /* Packages inherit the wider canvas too */
    body.page-id-1180 #booknetic-tab-packages table tbody tr {
        width: 100% !important;
        max-width: 100% !important;
        padding: 14px !important;
    }
}

@media only screen and (max-width: 480px) {

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tabs {
        width: 38px !important;
        min-width: 38px !important;
        max-width: 38px !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab-wrapper {
        width: calc(100% - 38px) !important;
        max-width: calc(100% - 38px) !important;
        margin-left: 38px !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-sidebar-toggle,
    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tabs .booknetic-cp-tab-item {
        width: 32px !important;
        min-width: 32px !important;
        max-width: 32px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody tr {
        grid-template-columns: 74px minmax(0,1fr) auto !important;
        column-gap: 11px !important;
        padding: 12px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(2) {
        font-size: 17px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(4) {
        font-size: 13px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table
    .user_visit_details span:first-child {
        font-size: 13px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(5) {
        font-size: 15px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(6) {
        font-size: 12px !important;
    }
}

/* =========================================================
   MOBILE CUSTOMER ACCOUNT — V18
   TRUE FULL-WIDTH CONTENT FIX
   The live HTML confirms .booknetic-cp-tab-wrapper directly
   contains the active tab/body/table. So use wrapper padding
   for the rail instead of margin-left + reduced width.
   ========================================================= */

@media only screen and (max-width: 1000px) {

    /* Sidebar stays over the body */
    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tabs {
        width: 40px !important;
        min-width: 40px !important;
        max-width: 40px !important;
    }

    /*
     * IMPORTANT:
     * Keep wrapper full-width.
     * Reserve only the rail width INSIDE it using padding-left.
     * This removes the unexplained extra black gutter created by
     * margin-left + calc(width).
     */
    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab-wrapper {
        position: relative !important;

        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        margin-left: 0 !important;
        margin-right: 0 !important;

        padding-left: 40px !important;
        padding-right: 0 !important;

        box-sizing: border-box !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab,
    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab.show {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        margin: 0 !important;
        padding: 0 !important;

        box-sizing: border-box !important;
    }

    body.page-id-1180 #booknetic-tab-appointments .booknetic-cp-tab-body,
    body.page-id-1180 #booknetic-tab-packages .booknetic-cp-tab-body {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        margin: 0 !important;
        padding: 8px 4px 18px !important;

        box-sizing: border-box !important;
        overflow-x: hidden !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table,
    body.page-id-1180 #booknetic-tab-packages table,
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody,
    body.page-id-1180 #booknetic-tab-packages table tbody {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        margin: 0 !important;
        padding: 0 !important;

        box-sizing: border-box !important;
    }

    /* Appointment cards now consume the whole available area */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody tr {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        grid-template-columns: 80px minmax(0, 1fr) auto !important;
        column-gap: 14px !important;
        row-gap: 8px !important;

        margin: 0 !important;
        padding: 14px !important;

        box-sizing: border-box !important;
    }

    /* Service */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(2) {
        min-width: 0 !important;

        font-size: 18px !important;
        line-height: 1.15 !important;

        word-break: normal !important;
        overflow-wrap: normal !important;
        hyphens: none !important;
        -webkit-hyphens: none !important;
    }

    /* Price: keep currency and number on one line */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(5) {
        display: flex !important;
        align-items: baseline !important;
        gap: 5px !important;

        min-width: max-content !important;

        color: #FFD700 !important;
        font-size: 15px !important;
        line-height: 1 !important;

        white-space: nowrap !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(5)::before {
        flex: 0 0 auto !important;
        white-space: nowrap !important;
    }

    /* Duration stays on a single line too */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(6) {
        min-width: max-content !important;
        white-space: nowrap !important;
    }

    /* Package cards also use the full available width */
    body.page-id-1180 #booknetic-tab-packages table tbody tr {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        margin: 0 !important;
        box-sizing: border-box !important;
    }
}

@media only screen and (max-width: 480px) {

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tabs {
        width: 38px !important;
        min-width: 38px !important;
        max-width: 38px !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-tab-wrapper {
        width: 100% !important;
        max-width: 100% !important;

        margin-left: 0 !important;
        padding-left: 38px !important;
    }

    body.page-id-1180 #booknetic-tab-appointments .booknetic-cp-tab-body,
    body.page-id-1180 #booknetic-tab-packages .booknetic-cp-tab-body {
        padding-left: 3px !important;
        padding-right: 3px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody tr {
        grid-template-columns: 76px minmax(0, 1fr) auto !important;
        column-gap: 11px !important;
        padding: 12px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(2) {
        font-size: 17px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(5) {
        font-size: 14px !important;
    }
}

/* =========================================================
   MOBILE CUSTOMER ACCOUNT — V19
   Concept polish + icons.
   Date formatting is handled by the companion JS.
   ========================================================= */

@media only screen and (max-width: 1000px) {

    /* -----------------------------------------------------
       APPOINTMENT CARD — final concept direction
       ----------------------------------------------------- */

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody tr {
        grid-template-columns: 92px minmax(0, 1fr) auto !important;
        grid-template-areas:
            "date service status"
            "date staff staff"
            "date details details"
            "actions actions actions" !important;

        column-gap: 16px !important;
        row-gap: 7px !important;

        padding: 16px !important;

        background:
            linear-gradient(145deg,
                rgba(18,18,18,.98) 0%,
                rgba(8,8,8,.99) 100%) !important;

        border: 1px solid #333333 !important;
        border-radius: 7px !important;

        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.02),
            0 8px 22px rgba(0,0,0,.18) !important;
    }

    /* DATE COLUMN */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(4) {
        grid-area: date !important;

        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        justify-content: center !important;

        min-height: 104px !important;

        padding: 0 14px 0 0 !important;

        border-right: 1px solid rgba(255,255,255,.12) !important;

        color: #FFD700 !important;
        font-size: 16px !important;
        font-weight: 700 !important;
        line-height: 1.25 !important;
        text-align: left !important;

        white-space: normal !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(4)::before {
        content: "DATE" !important;
        display: block !important;

        margin: 0 0 7px !important;

        color: #8B8B8B !important;
        font-size: 8px !important;
        font-weight: 700 !important;
        letter-spacing: .8px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table
    .dp-appointment-date {
        display: block !important;
        color: #FFD700 !important;
        font-size: 16px !important;
        font-weight: 700 !important;
        line-height: 1.2 !important;
        white-space: nowrap !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table
    .dp-appointment-time {
        display: block !important;
        margin-top: 3px !important;

        color: #FFD700 !important;
        font-size: 16px !important;
        font-weight: 700 !important;
        line-height: 1.2 !important;
        white-space: nowrap !important;
    }

    /* SERVICE */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(2) {
        grid-area: service !important;

        color: #FFFFFF !important;
        font-size: 19px !important;
        font-weight: 600 !important;
        line-height: 1.14 !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(2)::before {
        content: "SERVICE" !important;
        display: block !important;

        margin: 0 0 5px !important;

        color: #8E8E8E !important;
        font-size: 8px !important;
        font-weight: 700 !important;
        letter-spacing: .7px !important;
    }

    /* STATUS */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(7) {
        grid-area: status !important;
        align-self: start !important;
        justify-self: end !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table
    .booknetic_appointment_status_all {
        min-height: 28px !important;
        padding: 0 12px !important;

        background: rgba(255,215,0,.08) !important;
        border: 1px solid rgba(255,215,0,.38) !important;
        border-radius: 999px !important;

        font-size: 8.5px !important;
        font-weight: 700 !important;
        letter-spacing: .3px !important;
        text-transform: uppercase !important;
    }

    /* STAFF */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(3) {
        grid-area: staff !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table
    .user_visit_details span:first-child {
        color: #BEBEBE !important;
        font-size: 13.5px !important;
        line-height: 1.25 !important;
    }

    /* Remove old 'Staff ·' pseudo label if present */
    body.page-id-1180 #booknetic_customer_panel_appointments_table
    .user_visit_details span:first-child::before {
        content: none !important;
        display: none !important;
    }

    /* DETAILS */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(5) {
        grid-area: details !important;

        display: inline-flex !important;
        align-items: center !important;
        justify-self: start !important;
        gap: 8px !important;

        color: #FFD700 !important;
        font-size: 16px !important;
        font-weight: 700 !important;
        line-height: 1 !important;
        white-space: nowrap !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(5)::before {
        content: "\f02b" !important;
        display: inline-block !important;

        font-family: "Font Awesome 6 Free", "Font Awesome 5 Free" !important;
        font-size: 13px !important;
        font-weight: 900 !important;

        color: #FFD700 !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(6) {
        grid-area: details !important;

        display: inline-flex !important;
        align-items: center !important;
        justify-self: end !important;
        gap: 8px !important;

        color: #B8B8B8 !important;
        font-size: 13px !important;
        line-height: 1 !important;
        white-space: nowrap !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(6)::before {
        content: "\f017" !important;
        display: inline-block !important;

        font-family: "Font Awesome 6 Free", "Font Awesome 5 Free" !important;
        font-size: 13px !important;
        font-weight: 900 !important;

        color: #AFAFAF !important;
    }

    /* -----------------------------------------------------
       PACKAGE CARD — matching concept
       ----------------------------------------------------- */

    body.page-id-1180 #booknetic-tab-packages table tbody tr {
        grid-template-columns: minmax(0,1fr) auto !important;
        grid-template-areas:
            "name price"
            "usage usage"
            "date action" !important;

        column-gap: 14px !important;
        row-gap: 12px !important;

        padding: 16px !important;

        background:
            linear-gradient(145deg,
                rgba(18,18,18,.98) 0%,
                rgba(8,8,8,.99) 100%) !important;

        border: 1px solid #333333 !important;
        border-radius: 7px !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(2) {
        grid-area: name !important;

        color: #FFFFFF !important;
        font-size: 18px !important;
        font-weight: 600 !important;
        line-height: 1.15 !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(2)::before {
        content: "PACKAGE" !important;
        display: block !important;

        margin-bottom: 5px !important;

        color: #8E8E8E !important;
        font-size: 8px !important;
        font-weight: 700 !important;
        letter-spacing: .7px !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(3) {
        grid-area: price !important;

        justify-self: end !important;

        color: #FFD700 !important;
        font-size: 16px !important;
        font-weight: 700 !important;
        white-space: nowrap !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(4) {
        grid-area: usage !important;

        padding: 10px 0 12px !important;

        border-top: 1px solid rgba(255,215,0,.16) !important;
        border-bottom: 1px solid rgba(255,255,255,.07) !important;

        color: #E0E0E0 !important;
        font-size: 13px !important;
        line-height: 1.3 !important;
    }

    body.page-id-1180 #booknetic-tab-packages
    .booknetic-package-progressbar {
        height: 5px !important;
        margin-top: 9px !important;
        background: #2B2B2B !important;
        border-radius: 999px !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(5) {
        grid-area: date !important;

        display: inline-flex !important;
        align-items: center !important;
        gap: 8px !important;

        color: #AFAFAF !important;
        font-size: 11px !important;
        line-height: 1.2 !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(5)::before {
        content: "\f133" !important;
        display: inline-block !important;

        font-family: "Font Awesome 6 Free", "Font Awesome 5 Free" !important;
        font-size: 13px !important;
        font-weight: 900 !important;

        color: #AFAFAF !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(6) {
        grid-area: action !important;
        justify-self: end !important;
    }

    body.page-id-1180 #booknetic-tab-packages .booknetic_pay_package_btn,
    body.page-id-1180 #booknetic-tab-packages .booknetic_manage_package_btn {
        width: auto !important;
        min-width: 150px !important;
        min-height: 42px !important;

        padding: 0 18px !important;

        background: transparent !important;
        color: #FFD700 !important;

        border: 1px solid rgba(255,215,0,.75) !important;
        border-radius: 3px !important;

        font-size: 10px !important;
        font-weight: 700 !important;
        letter-spacing: .35px !important;
    }

    body.page-id-1180 #booknetic-tab-packages .booknetic_pay_package_btn i,
    body.page-id-1180 #booknetic-tab-packages .booknetic_manage_package_btn i {
        margin-right: 8px !important;
        color: #FFD700 !important;
        font-size: 12px !important;
    }
}

@media only screen and (max-width: 480px) {

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody tr {
        grid-template-columns: 86px minmax(0,1fr) auto !important;
        column-gap: 12px !important;
        padding: 14px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(2) {
        font-size: 18px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table
    .dp-appointment-date,
    body.page-id-1180 #booknetic_customer_panel_appointments_table
    .dp-appointment-time {
        font-size: 15px !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(2) {
        font-size: 17px !important;
    }

    body.page-id-1180 #booknetic-tab-packages .booknetic_pay_package_btn,
    body.page-id-1180 #booknetic-tab-packages .booknetic_manage_package_btn {
        min-width: 132px !important;
        padding: 0 14px !important;
    }
}

/* =========================================================
   MOBILE CUSTOMER ACCOUNT — V20
   Appointment card alignment refinements
   - Date block vertically centred
   - Staff name moved upward
   - Price and duration aligned on same baseline
   - Divider between price and duration
   ========================================================= */

@media only screen and (max-width: 1000px) {

    /* Give the card a slightly tighter, cleaner vertical rhythm */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody tr {
        grid-template-areas:
            "date service status"
            "date staff staff"
            "date details details"
            "actions actions actions" !important;

        row-gap: 5px !important;
        align-items: center !important;
    }

    /* Centre the complete date/time block in the left panel */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(4) {
        align-self: stretch !important;
        justify-content: center !important;
        min-height: 118px !important;

        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    /* Move staff name closer to the service title */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(3) {
        margin-top: -4px !important;
        margin-bottom: 2px !important;
        align-self: start !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table
    .user_visit_details {
        margin: 0 !important;
        padding: 0 !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table
    .user_visit_details span:first-child {
        display: block !important;
        margin: 0 !important;

        color: #C3C3C3 !important;
        font-size: 13.5px !important;
        line-height: 1.15 !important;
    }

    /* Keep the lower details row balanced */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(5),
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(6) {
        align-self: end !important;
        margin-top: 4px !important;
    }

    /* Price */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(5) {
        position: relative !important;

        padding-right: 20px !important;
        margin-right: 14px !important;
    }

    /* Vertical divider between PRICE and DURATION */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(5)::after {
        content: "" !important;

        position: absolute !important;
        top: 50% !important;
        right: 0 !important;

        width: 1px !important;
        height: 24px !important;

        background: rgba(255,255,255,.18) !important;

        transform: translateY(-50%) !important;
    }

    /* Duration */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(6) {
        padding-left: 0 !important;
    }
}

@media only screen and (max-width: 480px) {

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(4) {
        min-height: 112px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(5) {
        padding-right: 14px !important;
        margin-right: 10px !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(5)::after {
        height: 22px !important;
    }
}

/* =========================================================
   MOBILE CUSTOMER ACCOUNT — V21
   FIX: price disappeared because price + duration shared
   the same CSS grid area. Give each its own grid position.
   ========================================================= */

@media only screen and (max-width: 1000px) {

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody tr {
        grid-template-columns: 92px minmax(0, 1fr) auto !important;
        grid-template-areas:
            "date service status"
            "date staff staff"
            "date price duration"
            "actions actions actions" !important;
    }

    /* Price */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(5) {
        grid-area: price !important;

        display: inline-flex !important;
        align-items: center !important;
        justify-self: start !important;

        margin: 4px 0 0 !important;
        padding: 0 !important;

        color: #FFD700 !important;
        font-size: 16px !important;
        font-weight: 700 !important;
        line-height: 1 !important;
        white-space: nowrap !important;

        position: static !important;
    }

    /* Remove the v20 divider from the price cell */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(5)::after {
        content: none !important;
        display: none !important;
    }

    /* Duration */
    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(6) {
        grid-area: duration !important;

        display: inline-flex !important;
        align-items: center !important;
        justify-self: end !important;

        margin: 4px 0 0 !important;
        padding: 0 0 0 18px !important;

        border-left: 1px solid rgba(255,255,255,.18) !important;

        color: #B8B8B8 !important;
        font-size: 13px !important;
        line-height: 24px !important;
        white-space: nowrap !important;
    }
}

@media only screen and (max-width: 480px) {

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody tr {
        grid-template-columns: 86px minmax(0, 1fr) auto !important;
    }

    body.page-id-1180 #booknetic_customer_panel_appointments_table tbody td:nth-child(6) {
        padding-left: 14px !important;
    }
}

/* =========================================================
   MOBILE CUSTOMER ACCOUNT — V22
   PACKAGE CARD REBUILD
   Appointment cards are untouched.
   ========================================================= */

@media only screen and (max-width: 1000px) {

    /* Clean card structure */
    body.page-id-1180 #booknetic-tab-packages table tbody tr {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        grid-template-areas:
            "name price"
            "usage usage"
            "date action" !important;

        gap: 0 !important;
        column-gap: 18px !important;

        width: 100% !important;
        max-width: 100% !important;

        margin: 0 0 12px !important;
        padding: 17px 18px !important;

        background:
            linear-gradient(145deg,
                rgba(18,18,18,.98) 0%,
                rgba(7,7,7,.99) 100%) !important;

        border: 1px solid #353535 !important;
        border-radius: 8px !important;

        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.025),
            0 8px 22px rgba(0,0,0,.16) !important;
    }

    /* ID — completely remove */
    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(1) {
        display: none !important;
    }

    /* PACKAGE NAME */
    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(2) {
        grid-area: name !important;

        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 0 14px !important;

        color: #FFFFFF !important;
        font-size: 18px !important;
        font-weight: 600 !important;
        line-height: 1.18 !important;

        border-bottom: 1px solid rgba(255,215,0,.18) !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(2)::before {
        content: "PACKAGE" !important;
        display: block !important;

        margin: 0 0 6px !important;

        color: #FFD700 !important;
        font-size: 8px !important;
        font-weight: 700 !important;
        letter-spacing: .85px !important;
        line-height: 1 !important;
    }

    /* PRICE */
    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(3) {
        grid-area: price !important;

        align-self: end !important;
        justify-self: end !important;

        margin: 0 !important;
        padding: 0 0 14px !important;

        color: #FFD700 !important;
        font-size: 17px !important;
        font-weight: 700 !important;
        line-height: 1 !important;
        white-space: nowrap !important;

        border-bottom: 1px solid rgba(255,215,0,.18) !important;
    }

    /* USAGE + PROGRESS */
    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(4) {
        grid-area: usage !important;

        display: block !important;

        margin: 0 !important;
        padding: 14px 0 15px !important;

        color: #E8E8E8 !important;
        font-size: 13.5px !important;
        font-weight: 400 !important;
        line-height: 1.25 !important;

        border-bottom: 1px solid rgba(255,255,255,.08) !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(4)::before,
    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(4)::after {
        content: none !important;
        display: none !important;
    }

    body.page-id-1180 #booknetic-tab-packages
    .booknetic-package-progressbar {
        display: block !important;

        width: 100% !important;
        height: 6px !important;

        margin: 10px 0 0 !important;
        padding: 0 !important;

        background: #2B2B2B !important;
        border: 0 !important;
        border-radius: 999px !important;

        overflow: hidden !important;
    }

    body.page-id-1180 #booknetic-tab-packages
    .booknetic-package-progressbar > span {
        display: block !important;
        height: 100% !important;

        background: #FFD700 !important;
        border-radius: 999px !important;
    }

    /* CREATED DATE */
    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(5) {
        grid-area: date !important;

        display: flex !important;
        align-items: center !important;
        align-self: center !important;
        gap: 10px !important;

        min-width: 0 !important;

        margin: 0 !important;
        padding: 15px 0 0 !important;

        color: #B8B8B8 !important;
        font-size: 12.5px !important;
        font-weight: 400 !important;
        line-height: 1.25 !important;

        border: 0 !important;
        white-space: nowrap !important;
    }

    /* Kill old labels / artifacts */
    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(5)::before {
        content: "\f133" !important;
        display: inline-block !important;

        flex: 0 0 auto !important;

        font-family: "Font Awesome 6 Free", "Font Awesome 5 Free" !important;
        font-size: 14px !important;
        font-weight: 900 !important;

        color: #AFAFAF !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(5)::after {
        content: none !important;
        display: none !important;
    }

    body.page-id-1180 #booknetic-tab-packages .dp-package-date-wrap {
        display: flex !important;
        flex-direction: column !important;
        gap: 2px !important;
    }

    body.page-id-1180 #booknetic-tab-packages .dp-package-date-label {
        color: #7F7F7F !important;
        font-size: 7.5px !important;
        font-weight: 700 !important;
        letter-spacing: .7px !important;
        line-height: 1 !important;
    }

    body.page-id-1180 #booknetic-tab-packages .dp-package-date {
        color: #D5D5D5 !important;
        font-size: 12.5px !important;
        line-height: 1.15 !important;
        white-space: nowrap !important;
    }

    /* ACTION */
    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(6) {
        grid-area: action !important;

        align-self: end !important;
        justify-self: end !important;

        margin: 0 !important;
        padding: 14px 0 0 !important;

        border: 0 !important;
    }

    body.page-id-1180 #booknetic-tab-packages .booknetic_pay_package_btn,
    body.page-id-1180 #booknetic-tab-packages .booknetic_manage_package_btn {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 9px !important;

        width: auto !important;
        min-width: 145px !important;
        height: 42px !important;
        min-height: 42px !important;

        margin: 0 !important;
        padding: 0 17px !important;

        background: transparent !important;
        color: #FFD700 !important;

        border: 1px solid rgba(255,215,0,.78) !important;
        border-radius: 4px !important;

        font-family: Helvetica, Arial, sans-serif !important;
        font-size: 10px !important;
        font-weight: 700 !important;
        letter-spacing: .35px !important;
        line-height: 1 !important;
        white-space: nowrap !important;

        box-shadow: none !important;
    }

    body.page-id-1180 #booknetic-tab-packages .booknetic_pay_package_btn i,
    body.page-id-1180 #booknetic-tab-packages .booknetic_manage_package_btn i {
        margin: 0 !important;

        color: #FFD700 !important;
        font-size: 13px !important;
    }

    body.page-id-1180 #booknetic-tab-packages .booknetic_pay_package_btn:hover,
    body.page-id-1180 #booknetic-tab-packages .booknetic_manage_package_btn:hover {
        background:
            linear-gradient(180deg, #FFE66A 0%, #FFD700 50%, #E6B800 100%) !important;

        color: #000000 !important;
    }

    body.page-id-1180 #booknetic-tab-packages .booknetic_pay_package_btn:hover i,
    body.page-id-1180 #booknetic-tab-packages .booknetic_manage_package_btn:hover i {
        color: #000000 !important;
    }
}

@media only screen and (max-width: 480px) {

    body.page-id-1180 #booknetic-tab-packages table tbody tr {
        column-gap: 12px !important;
        padding: 15px 14px !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(2) {
        font-size: 17px !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(3) {
        font-size: 15.5px !important;
    }

    body.page-id-1180 #booknetic-tab-packages table tbody td:nth-child(5) {
        font-size: 11.5px !important;
    }

    body.page-id-1180 #booknetic-tab-packages .dp-package-date {
        font-size: 11.5px !important;
    }

    body.page-id-1180 #booknetic-tab-packages .booknetic_pay_package_btn,
    body.page-id-1180 #booknetic-tab-packages .booknetic_manage_package_btn {
        min-width: 132px !important;
        height: 40px !important;
        min-height: 40px !important;

        padding: 0 13px !important;
        font-size: 9px !important;
    }
}

/* =========================================================
   MOBILE CUSTOMER ACCOUNT — V23
   PACKAGE CARD SPECIFICITY FIX
   Overrides the older high-specificity Booknetic package rules.
   Appointment cards are untouched.
   ========================================================= */

@media only screen and (max-width: 1000px) {

    /* TRUE CARD GRID — override older display:block rule */
    body.page-id-1180
    #booknetic-tab-packages
    .booknetic-packages-list
    .booknetic_elegant_table
    tbody tr {
        display: grid !important;
        grid-template-columns: minmax(0,1fr) auto !important;
        grid-template-areas:
            "name price"
            "usage usage"
            "date action" !important;

        column-gap: 16px !important;
        row-gap: 0 !important;

        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        margin: 0 0 12px !important;
        padding: 17px 18px !important;

        background:
            linear-gradient(145deg,
                rgba(18,18,18,.98) 0%,
                rgba(7,7,7,.99) 100%) !important;

        border: 1px solid #353535 !important;
        border-radius: 8px !important;

        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.025),
            0 8px 22px rgba(0,0,0,.16) !important;

        overflow: hidden !important;
    }

    /* Remove old decorative vertical stripe */
    body.page-id-1180
    #booknetic-tab-packages
    .booknetic-packages-list
    .booknetic_elegant_table
    tbody tr::before {
        content: none !important;
        display: none !important;
    }

    /* Reset every old table-cell layout */
    body.page-id-1180
    #booknetic-tab-packages
    .booknetic-packages-list
    .booknetic_elegant_table
    tbody td {
        display: block !important;

        width: auto !important;
        max-width: 100% !important;
        min-width: 0 !important;

        margin: 0 !important;
        padding: 0 !important;

        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;

        white-space: normal !important;
        overflow: visible !important;
        overflow-wrap: normal !important;
    }

    /* Kill ALL old cell labels first */
    body.page-id-1180
    #booknetic-tab-packages
    .booknetic-packages-list
    .booknetic_elegant_table
    tbody td::before,
    body.page-id-1180
    #booknetic-tab-packages
    .booknetic-packages-list
    .booknetic_elegant_table
    tbody td::after {
        content: none !important;
        display: none !important;
    }

    /* ID */
    body.page-id-1180
    #booknetic-tab-packages
    .booknetic-packages-list
    .booknetic_elegant_table
    tbody td:nth-child(1) {
        display: none !important;
    }

    /* PACKAGE NAME */
    body.page-id-1180
    #booknetic-tab-packages
    .booknetic-packages-list
    .booknetic_elegant_table
    tbody td:nth-child(2) {
        grid-area: name !important;

        display: block !important;
        align-self: end !important;

        padding: 0 0 14px !important;

        color: #FFFFFF !important;
        font-size: 18px !important;
        font-weight: 600 !important;
        line-height: 1.16 !important;

        border-bottom: 1px solid rgba(255,215,0,.18) !important;
    }

    body.page-id-1180
    #booknetic-tab-packages
    .booknetic-packages-list
    .booknetic_elegant_table
    tbody td:nth-child(2)::before {
        content: "PACKAGE" !important;
        display: block !important;

        margin: 0 0 6px !important;

        color: #FFD700 !important;
        font-family: Helvetica, Arial, sans-serif !important;
        font-size: 8px !important;
        font-weight: 700 !important;
        letter-spacing: .85px !important;
        line-height: 1 !important;
    }

    /* PRICE — same top row, right aligned */
    body.page-id-1180
    #booknetic-tab-packages
    .booknetic-packages-list
    .booknetic_elegant_table
    tbody td:nth-child(3) {
        grid-area: price !important;

        display: block !important;
        align-self: end !important;
        justify-self: end !important;

        padding: 0 0 14px !important;

        color: #FFD700 !important;
        font-size: 17px !important;
        font-weight: 700 !important;
        line-height: 1 !important;
        text-align: right !important;
        white-space: nowrap !important;

        border-bottom: 1px solid rgba(255,215,0,.18) !important;
    }

    /* USAGE + PROGRESS */
    body.page-id-1180
    #booknetic-tab-packages
    .booknetic-packages-list
    .booknetic_elegant_table
    tbody td:nth-child(4) {
        grid-area: usage !important;

        display: block !important;

        padding: 14px 0 15px !important;

        color: #E5E5E5 !important;
        font-size: 13.5px !important;
        font-weight: 400 !important;
        line-height: 1.35 !important;

        border-bottom: 1px solid rgba(255,255,255,.08) !important;
    }

    body.page-id-1180
    #booknetic-tab-packages
    .booknetic-package-progressbar {
        display: block !important;

        width: 100% !important;
        max-width: 100% !important;
        height: 6px !important;

        margin: 10px 0 0 !important;
        padding: 0 !important;

        background: #2A2A2A !important;
        border: 0 !important;
        border-radius: 999px !important;

        overflow: hidden !important;
    }

    body.page-id-1180
    #booknetic-tab-packages
    .booknetic-package-progressbar > span {
        display: block !important;
        height: 100% !important;
        background: #FFD700 !important;
        border-radius: 999px !important;
    }

    /* CREATED DATE */
    body.page-id-1180
    #booknetic-tab-packages
    .booknetic-packages-list
    .booknetic_elegant_table
    tbody td:nth-child(5) {
        grid-area: date !important;

        display: flex !important;
        align-items: center !important;
        align-self: center !important;
        gap: 10px !important;

        padding: 15px 0 0 !important;

        color: #D0D0D0 !important;
        font-size: 12px !important;
        line-height: 1.2 !important;

        white-space: nowrap !important;
    }

    body.page-id-1180
    #booknetic-tab-packages
    .booknetic-packages-list
    .booknetic_elegant_table
    tbody td:nth-child(5)::before {
        content: "\f133" !important;
        display: inline-block !important;

        flex: 0 0 auto !important;

        color: #AFAFAF !important;
        font-family: "Font Awesome 6 Free", "Font Awesome 5 Free" !important;
        font-size: 14px !important;
        font-weight: 900 !important;
        line-height: 1 !important;
    }

    body.page-id-1180
    #booknetic-tab-packages
    .dp-package-date-wrap {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 3px !important;

        min-width: 0 !important;
    }

    body.page-id-1180
    #booknetic-tab-packages
    .dp-package-date-label {
        display: block !important;

        color: #777777 !important;
        font-size: 7.5px !important;
        font-weight: 700 !important;
        letter-spacing: .75px !important;
        line-height: 1 !important;
    }

    body.page-id-1180
    #booknetic-tab-packages
    .dp-package-date {
        display: block !important;

        color: #D5D5D5 !important;
        font-size: 12.5px !important;
        font-weight: 400 !important;
        line-height: 1.1 !important;
        white-space: nowrap !important;
    }

    /* ACTION */
    body.page-id-1180
    #booknetic-tab-packages
    .booknetic-packages-list
    .booknetic_elegant_table
    tbody td:nth-child(6) {
        grid-area: action !important;

        display: block !important;
        align-self: end !important;
        justify-self: end !important;

        padding: 14px 0 0 !important;
    }

    body.page-id-1180
    #booknetic-tab-packages
    .booknetic_pay_package_btn,
    body.page-id-1180
    #booknetic-tab-packages
    .booknetic_manage_package_btn {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 9px !important;

        width: auto !important;
        max-width: none !important;
        min-width: 145px !important;
        height: 42px !important;
        min-height: 42px !important;

        margin: 0 !important;
        padding: 0 17px !important;

        background: transparent !important;
        color: #FFD700 !important;

        border: 1px solid rgba(255,215,0,.78) !important;
        border-radius: 4px !important;

        font-family: Helvetica, Arial, sans-serif !important;
        font-size: 10px !important;
        font-weight: 700 !important;
        letter-spacing: .35px !important;
        line-height: 1 !important;
        white-space: nowrap !important;
    }
}

@media only screen and (max-width: 480px) {

    body.page-id-1180
    #booknetic-tab-packages
    .booknetic-packages-list
    .booknetic_elegant_table
    tbody tr {
        grid-template-columns: minmax(0,1fr) auto !important;
        column-gap: 12px !important;

        padding: 15px 14px !important;
    }

    body.page-id-1180
    #booknetic-tab-packages
    .booknetic-packages-list
    .booknetic_elegant_table
    tbody td:nth-child(2) {
        font-size: 17px !important;
    }

    body.page-id-1180
    #booknetic-tab-packages
    .booknetic-packages-list
    .booknetic_elegant_table
    tbody td:nth-child(3) {
        font-size: 15px !important;
    }

    body.page-id-1180
    #booknetic-tab-packages
    .booknetic_pay_package_btn,
    body.page-id-1180
    #booknetic-tab-packages
    .booknetic_manage_package_btn {
        min-width: 132px !important;
        height: 40px !important;
        min-height: 40px !important;

        padding: 0 13px !important;
        font-size: 9px !important;
    }
}

/* =========================================================
   MOBILE CUSTOMER ACCOUNT — V24
   PAY NOW POPUP FIX
   Centres the package-payment modal in the viewport and
   prevents it being clipped by the account sidebar/content.
   ========================================================= */

@media only screen and (max-width: 1000px) {

    /* Hidden state must remain controlled by Booknetic */
    body.page-id-1180 #booknetic_packages_pay_now_popup.booknetic_hidden {
        display: none !important;
    }

    /* Full-screen overlay */
    body.page-id-1180 #booknetic_packages_pay_now_popup:not(.booknetic_hidden) {
        position: fixed !important;
        inset: 0 !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 100vw !important;
        max-width: none !important;
        height: 100dvh !important;
        min-height: 100vh !important;

        margin: 0 !important;
        padding: 18px !important;

        background: rgba(0,0,0,.78) !important;

        z-index: 999999 !important;

        box-sizing: border-box !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
    }

    /* Popup panel */
    body.page-id-1180 #booknetic_packages_pay_now_popup .booknetic_popup_body {
        position: relative !important;

        width: min(430px, calc(100vw - 32px)) !important;
        max-width: 430px !important;
        min-width: 0 !important;

        margin: auto !important;
        padding: 0 !important;

        background:
            linear-gradient(145deg,
                #161616 0%,
                #0B0B0B 100%) !important;

        border: 1px solid rgba(255,215,0,.55) !important;
        border-radius: 8px !important;

        box-shadow:
            0 28px 70px rgba(0,0,0,.62),
            inset 0 1px 0 rgba(255,255,255,.03) !important;

        overflow: hidden !important;
        box-sizing: border-box !important;
    }

    /* Popup heading */
    body.page-id-1180 #booknetic_packages_pay_now_popup .booknetic_popup_body::before {
        content: "PAY FOR PACKAGE" !important;

        display: block !important;

        width: 100% !important;
        margin: 0 !important;
        padding: 20px 22px 17px !important;

        color: #FFFFFF !important;
        font-family: Helvetica, Arial, sans-serif !important;
        font-size: 18px !important;
        font-weight: 500 !important;
        line-height: 1.15 !important;
        letter-spacing: .2px !important;

        border-bottom: 1px solid rgba(255,215,0,.25) !important;

        box-sizing: border-box !important;
    }

    /* Main popup content */
    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_packages_pay_now_popup_body {
        width: 100% !important;
        margin: 0 !important;
        padding: 20px 22px !important;

        box-sizing: border-box !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_packages_pay_now_popup_body .form-row,
    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_packages_pay_now_popup_body .form-group {
        width: 100% !important;
        max-width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_packages_pay_now_popup_body label {
        display: block !important;

        margin: 0 0 9px !important;

        color: #8D8D8D !important;
        font-family: Helvetica, Arial, sans-serif !important;
        font-size: 9px !important;
        font-weight: 700 !important;
        line-height: 1.1 !important;
        letter-spacing: .75px !important;
        text-transform: uppercase !important;
    }

    /* Native select fallback */
    body.page-id-1180
    #booknetic_packages_pay_now_popup
    select.form-control {
        width: 100% !important;
        height: 50px !important;

        padding: 0 14px !important;

        background: #0A0A0A !important;
        color: #FFFFFF !important;

        border: 1px solid #3C3C3C !important;
        border-radius: 3px !important;

        font-size: 16px !important;
        box-sizing: border-box !important;
    }

    /* Select2 container */
    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .select2-container {
        width: 100% !important;
        max-width: 100% !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .select2-container .select2-selection--single {
        display: flex !important;
        align-items: center !important;

        width: 100% !important;
        height: 50px !important;

        padding: 0 42px 0 14px !important;

        background: #0A0A0A !important;

        border: 1px solid #3C3C3C !important;
        border-radius: 3px !important;

        box-sizing: border-box !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .select2-selection__rendered {
        width: 100% !important;

        padding: 0 !important;

        color: #FFFFFF !important;
        font-size: 16px !important;
        line-height: 48px !important;

        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .select2-selection__arrow {
        top: 0 !important;
        right: 12px !important;

        width: 24px !important;
        height: 50px !important;
    }

    /* Footer/buttons */
    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_reschedule_popup_footer {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 12px !important;

        width: 100% !important;

        margin: 0 !important;
        padding: 16px 22px 20px !important;

        background: rgba(0,0,0,.18) !important;
        border-top: 1px solid rgba(255,215,0,.22) !important;

        box-sizing: border-box !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_pay_now_popup_cancel,
    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_packages_pay_now_popup_confirm {
        width: 100% !important;
        height: 46px !important;
        min-height: 46px !important;

        margin: 0 !important;
        padding: 0 14px !important;

        border-radius: 4px !important;

        font-family: Helvetica, Arial, sans-serif !important;
        font-size: 11px !important;
        font-weight: 700 !important;
        letter-spacing: .3px !important;
        line-height: 1 !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_pay_now_popup_cancel {
        background: #0B0B0B !important;
        color: #FFFFFF !important;

        border: 1px solid rgba(255,215,0,.62) !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_packages_pay_now_popup_confirm {
        background:
            linear-gradient(
                180deg,
                #FFE66A 0%,
                #FFD700 50%,
                #E6B800 100%
            ) !important;

        color: #000000 !important;

        border: 1px solid #FFD700 !important;
    }

    /*
     * iPhone Safari:
     * keep Select2 search/input at 16px so focusing it does not
     * zoom the page and make the modal appear wider/off-centre.
     */
    body.page-id-1180
    .select2-container--open .select2-search__field,
    body.page-id-1180
    #booknetic_packages_pay_now_popup input,
    body.page-id-1180
    #booknetic_packages_pay_now_popup select {
        font-size: 16px !important;
    }

    /* Dropdown should match the popup and stay usable */
    body.page-id-1180 .select2-container--open {
        z-index: 1000000 !important;
    }

    body.page-id-1180 .select2-dropdown {
        background: #0A0A0A !important;
        color: #FFFFFF !important;

        border: 1px solid #3C3C3C !important;
    }

    body.page-id-1180 .select2-results__option {
        min-height: 40px !important;
        padding: 10px 12px !important;

        color: #FFFFFF !important;
        font-size: 14px !important;
    }

    body.page-id-1180
    .select2-container--default
    .select2-results__option--highlighted[aria-selected] {
        background: #FFD700 !important;
        color: #000000 !important;
    }
}

@media only screen and (max-width: 480px) {

    body.page-id-1180 #booknetic_packages_pay_now_popup:not(.booknetic_hidden) {
        padding: 14px !important;
    }

    body.page-id-1180 #booknetic_packages_pay_now_popup .booknetic_popup_body {
        width: calc(100vw - 28px) !important;
        max-width: calc(100vw - 28px) !important;
    }

    body.page-id-1180 #booknetic_packages_pay_now_popup .booknetic_popup_body::before {
        padding: 18px 18px 15px !important;
        font-size: 17px !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_packages_pay_now_popup_body {
        padding: 18px !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_reschedule_popup_footer {
        padding: 14px 18px 18px !important;
        gap: 10px !important;
    }
}

/* =========================================================
   PAY NOW POPUP — DOM-SAFE CONTAINING-BLOCK FIX
   Companion to pay-now-popup-fix-v2.js
   Keeps popup in Booknetic's original DOM so its JS works.
   ========================================================= */

@media only screen and (max-width: 1000px) {

    /*
     * These classes are applied only while the Pay Now popup is open.
     * Neutralise CSS properties that can make position:fixed behave
     * like position:absolute inside the customer account panel.
     */
    body.page-id-1180 .dp-pay-popup-ancestor {
        transform: none !important;
        -webkit-transform: none !important;

        filter: none !important;
        -webkit-filter: none !important;

        perspective: none !important;
        -webkit-perspective: none !important;

        contain: none !important;
        content-visibility: visible !important;

        will-change: auto !important;

        overflow: visible !important;
        clip: auto !important;
        clip-path: none !important;
    }

    body.page-id-1180.dp-pay-popup-open,
    html.dp-pay-popup-open {
        overflow: hidden !important;
    }

    /* Reassert viewport-centred overlay without relocating the popup */
    body.page-id-1180
    #booknetic_packages_pay_now_popup:not(.booknetic_hidden) {
        position: fixed !important;
        top: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        left: 0 !important;

        width: 100vw !important;
        max-width: none !important;
        height: 100dvh !important;
        min-height: 100vh !important;

        margin: 0 !important;
        padding: 18px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        box-sizing: border-box !important;
        z-index: 999999 !important;
    }
}

@media only screen and (max-width: 480px) {
    body.page-id-1180
    #booknetic_packages_pay_now_popup:not(.booknetic_hidden) {
        padding: 14px !important;
    }
}

/* =========================================================
   MOBILE CUSTOMER ACCOUNT — V26
   PAY NOW MODAL: FIT THE REAL BOOKNETIC CONTENT AREA
   Final override after legacy popup rules.
   - Keeps modal to the RIGHT of the mobile sidebar
   - Removes duplicate PAY FOR PACKAGE heading
   - Stops left-side clipping
   - Does not move popup in the DOM
   ========================================================= */

@media only screen and (max-width: 1000px) {

    /* Keep Booknetic hidden state intact */
    body.page-id-1180 #booknetic_packages_pay_now_popup.booknetic_hidden {
        display: none !important;
    }

    /*
     * The popup is trapped by Booknetic's customer-panel layout on mobile.
     * Instead of fighting that, deliberately reserve the sidebar width.
     */
    body.page-id-1180 #booknetic_packages_pay_now_popup:not(.booknetic_hidden) {
        position: fixed !important;

        top: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        left: 40px !important;

        inset: auto 0 0 40px !important;

        width: auto !important;
        max-width: none !important;
        min-width: 0 !important;

        height: 100dvh !important;
        min-height: 100vh !important;
        max-height: 100dvh !important;

        margin: 0 !important;
        padding: 14px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        background: rgba(0,0,0,.80) !important;

        overflow-x: hidden !important;
        overflow-y: auto !important;

        transform: none !important;
        z-index: 9999999 !important;

        box-sizing: border-box !important;
    }

    /*
     * Override BOTH the old :has() popup rule and the newer direct rule.
     * One panel only, centred in the available area beside the rail.
     */
    body.page-id-1180
    .booknetic_popup_body:has(.booknetic_packages_pay_now_popup_body),
    body.page-id-1180
    #booknetic_packages_pay_now_popup
    > .booknetic_popup_body {
        position: relative !important;

        top: auto !important;
        right: auto !important;
        bottom: auto !important;
        left: auto !important;

        transform: none !important;

        width: 100% !important;
        max-width: 410px !important;
        min-width: 0 !important;

        height: auto !important;
        min-height: 0 !important;
        max-height: calc(100dvh - 32px) !important;

        margin: auto !important;
        padding: 0 !important;

        background:
            linear-gradient(145deg,#161616 0%,#090909 100%) !important;

        border: 1px solid rgba(255,215,0,.62) !important;
        border-radius: 8px !important;

        box-shadow:
            0 26px 70px rgba(0,0,0,.68),
            inset 0 1px 0 rgba(255,255,255,.025) !important;

        overflow: hidden !important;
        box-sizing: border-box !important;
        z-index: 1 !important;
    }

    /* Remove the SECOND title introduced by the later popup CSS */
    body.page-id-1180
    #booknetic_packages_pay_now_popup
    > .booknetic_popup_body::before {
        content: none !important;
        display: none !important;
    }

    /*
     * Keep ONE heading: the existing pseudo-heading on the actual
     * package-payment content block.
     */
    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_packages_pay_now_popup_body::before {
        content: "PAY FOR PACKAGE" !important;
        display: block !important;

        margin: 0 0 17px !important;
        padding: 0 0 13px !important;

        color: #FFFFFF !important;

        border-bottom: 1px solid rgba(255,215,0,.24) !important;

        font-family: Helvetica, Arial, sans-serif !important;
        font-size: 18px !important;
        font-weight: 500 !important;
        line-height: 1.1 !important;
        letter-spacing: .15px !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_packages_pay_now_popup_body {
        width: 100% !important;
        max-width: 100% !important;

        margin: 0 !important;
        padding: 20px 20px 18px !important;

        background: transparent !important;
        box-sizing: border-box !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_packages_pay_now_popup_body .form-row,
    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_packages_pay_now_popup_body .form-group {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Payment gateway */
    body.page-id-1180
    #booknetic_packages_pay_now_popup
    label {
        display: block !important;

        margin: 0 0 9px !important;

        color: #8D8D8D !important;
        font-size: 9px !important;
        font-weight: 700 !important;
        line-height: 1.1 !important;
        letter-spacing: .7px !important;
        text-transform: uppercase !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .select2-container {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .select2-selection--single {
        display: flex !important;
        align-items: center !important;

        width: 100% !important;
        height: 50px !important;

        background: #090909 !important;

        border: 1px solid #3B3B3B !important;
        border-radius: 3px !important;

        box-sizing: border-box !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .select2-selection__rendered {
        width: 100% !important;

        padding: 0 44px 0 14px !important;

        color: #FFFFFF !important;
        font-size: 16px !important;
        line-height: 48px !important;

        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    /* Footer */
    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_reschedule_popup_footer {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 10px !important;

        width: 100% !important;

        margin: 0 !important;
        padding: 15px 20px 20px !important;

        background: #090909 !important;
        border-top: 1px solid rgba(255,215,0,.20) !important;

        box-sizing: border-box !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_reschedule_popup_footer button {
        width: 100% !important;
        min-width: 0 !important;
        height: 46px !important;
        min-height: 46px !important;

        margin: 0 !important;
        padding: 0 12px !important;

        border-radius: 4px !important;

        font-family: Helvetica, Arial, sans-serif !important;
        font-size: 11px !important;
        font-weight: 700 !important;
        letter-spacing: .25px !important;
        line-height: 1 !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_pay_now_popup_cancel {
        background: #0B0B0B !important;
        color: #F0F0F0 !important;

        border: 1px solid rgba(255,215,0,.58) !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_packages_pay_now_popup_confirm {
        background:
            linear-gradient(180deg,#FFE66A 0%,#FFD700 50%,#E6B800 100%) !important;

        color: #000000 !important;
        border: 1px solid #FFD700 !important;
    }

    /* Prevent iPhone Safari zoom */
    body.page-id-1180
    #booknetic_packages_pay_now_popup input,
    body.page-id-1180
    #booknetic_packages_pay_now_popup select,
    body.page-id-1180
    #booknetic_packages_pay_now_popup .select2-selection__rendered {
        font-size: 16px !important;
    }
}

@media only screen and (max-width: 480px) {

    body.page-id-1180 #booknetic_packages_pay_now_popup:not(.booknetic_hidden) {
        left: 38px !important;
        inset: auto 0 0 38px !important;

        padding: 10px !important;
    }

    body.page-id-1180
    .booknetic_popup_body:has(.booknetic_packages_pay_now_popup_body),
    body.page-id-1180
    #booknetic_packages_pay_now_popup
    > .booknetic_popup_body {
        width: 100% !important;
        max-width: 100% !important;
        max-height: calc(100dvh - 20px) !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_packages_pay_now_popup_body {
        padding: 18px 16px 16px !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_reschedule_popup_footer {
        padding: 14px 16px 17px !important;
    }
}

/* =========================================================
   MOBILE CUSTOMER ACCOUNT — V27
   PAY NOW MODAL POLISH
   - Slightly smaller modal
   - Smaller, cleaner buttons
   - Centres button text/icons
   - Consistent uppercase labels
   ========================================================= */

@media only screen and (max-width: 1000px) {

    /* Slightly narrower popup panel */
    body.page-id-1180
    .booknetic_popup_body:has(.booknetic_packages_pay_now_popup_body),
    body.page-id-1180
    #booknetic_packages_pay_now_popup
    > .booknetic_popup_body {
        width: 92% !important;
        max-width: 370px !important;
    }

    /* Tighten inner spacing */
    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_packages_pay_now_popup_body {
        padding: 18px 18px 16px !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_packages_pay_now_popup_body::before {
        margin-bottom: 15px !important;
        padding-bottom: 11px !important;
        font-size: 17px !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .select2-selection--single {
        height: 46px !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .select2-selection__rendered {
        line-height: 44px !important;
    }

    /* Smaller footer and buttons */
    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_reschedule_popup_footer {
        grid-template-columns: 1fr 1fr !important;
        gap: 10px !important;
        padding: 13px 18px 16px !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_reschedule_popup_footer button {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 100% !important;
        height: 40px !important;
        min-height: 40px !important;

        margin: 0 !important;
        padding: 0 12px !important;

        font-size: 10px !important;
        font-weight: 700 !important;
        line-height: 1 !important;
        letter-spacing: .35px !important;
        text-align: center !important;
        text-transform: uppercase !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_pay_now_popup_cancel,
    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_packages_pay_now_popup_confirm {
        border-radius: 3px !important;
    }
}

@media only screen and (max-width: 480px) {

    body.page-id-1180
    .booknetic_popup_body:has(.booknetic_packages_pay_now_popup_body),
    body.page-id-1180
    #booknetic_packages_pay_now_popup
    > .booknetic_popup_body {
        width: 94% !important;
        max-width: 350px !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_packages_pay_now_popup_body {
        padding: 16px 15px 14px !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_reschedule_popup_footer {
        padding: 12px 15px 15px !important;
        gap: 8px !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    .booknetic_reschedule_popup_footer button {
        height: 38px !important;
        min-height: 38px !important;
        font-size: 9.5px !important;
    }
}

/* =========================================================
   MOBILE CUSTOMER ACCOUNT — V28
   PAY NOW MODAL — FORCE COMPACT WIDTH
   Overrides remaining legacy full-width popup rules.
   ========================================================= */

@media only screen and (max-width: 1000px) {

    body.page-id-1180
    #booknetic_packages_pay_now_popup.booknetic_popup:not(.booknetic_hidden)
    > div.booknetic_popup_body {
        flex: 0 0 360px !important;

        width: 360px !important;
        max-width: calc(100% - 24px) !important;
        min-width: 0 !important;

        margin-left: auto !important;
        margin-right: auto !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    > div.booknetic_popup_body
    .booknetic_packages_pay_now_popup_body {
        padding: 17px 17px 15px !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    > div.booknetic_popup_body
    .booknetic_packages_pay_now_popup_body::before {
        font-size: 16px !important;
        margin-bottom: 14px !important;
        padding-bottom: 10px !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    > div.booknetic_popup_body
    .select2-selection--single {
        height: 44px !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    > div.booknetic_popup_body
    .select2-selection__rendered {
        line-height: 42px !important;
    }

    /* Compact button row instead of two oversized 50/50 buttons */
    body.page-id-1180
    #booknetic_packages_pay_now_popup
    > div.booknetic_popup_body
    .booknetic_reschedule_popup_footer {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 10px !important;

        padding: 13px 17px 16px !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    > div.booknetic_popup_body
    .booknetic_reschedule_popup_footer
    button {
        flex: 0 0 auto !important;

        width: 118px !important;
        min-width: 118px !important;
        max-width: 118px !important;

        height: 38px !important;
        min-height: 38px !important;

        padding: 0 12px !important;

        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        font-size: 10px !important;
        line-height: 1 !important;
        text-align: center !important;
    }
}

@media only screen and (max-width: 480px) {

    body.page-id-1180
    #booknetic_packages_pay_now_popup.booknetic_popup:not(.booknetic_hidden)
    > div.booknetic_popup_body {
        flex-basis: 330px !important;

        width: 330px !important;
        max-width: calc(100% - 20px) !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    > div.booknetic_popup_body
    .booknetic_reschedule_popup_footer {
        justify-content: center !important;
    }

    body.page-id-1180
    #booknetic_packages_pay_now_popup
    > div.booknetic_popup_body
    .booknetic_reschedule_popup_footer
    button {
        width: 112px !important;
        min-width: 112px !important;
        max-width: 112px !important;

        height: 36px !important;
        min-height: 36px !important;
    }
}

/* =========================================================
   MOBILE CUSTOMER ACCOUNT — V29
   RESTORE ACTION / SAVE FOOTERS
   Profile, Change Password, Email Preferences
   ========================================================= */

@media only screen and (max-width: 1000px) {

    /* These tabs need their action area to remain in normal flow */
    body.page-id-1180 #booknetic-tab-profile,
    body.page-id-1180 #booknetic-tab-change-password,
    body.page-id-1180 #booknetic-tab-email-preferences {
        overflow: visible !important;
        padding-bottom: 0 !important;
    }

    /* Do not let the mobile panel crop action footers */
    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-body {
        overflow-x: hidden !important;
        overflow-y: visible !important;
    }

    /*
     * Booknetic's mobile CSS can hide / position these footers.
     * Put them back into the document flow.
     */
    body.page-id-1180 #booknetic-tab-profile > .booknetic-cp-tab-footer,
    body.page-id-1180 #booknetic-tab-change-password > .booknetic-cp-tab-footer,
    body.page-id-1180 #booknetic-tab-email-preferences > .booknetic-cp-tab-footer {
        position: static !important;

        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        flex-wrap: wrap !important;
        gap: 10px !important;

        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        height: auto !important;
        min-height: 0 !important;

        margin: 0 !important;
        padding: 14px 18px 18px !important;

        background: #050505 !important;

        border: 0 !important;
        border-top: 1px solid rgba(255,215,0,.18) !important;

        box-shadow: none !important;

        visibility: visible !important;
        opacity: 1 !important;
        overflow: visible !important;

        box-sizing: border-box !important;
        z-index: 2 !important;
    }

    body.page-id-1180 #booknetic-tab-profile
    > .booknetic-cp-tab-footer .booknetic-cp-tab-footer-left,
    body.page-id-1180 #booknetic-tab-change-password
    > .booknetic-cp-tab-footer .booknetic-cp-tab-footer-left,
    body.page-id-1180 #booknetic-tab-email-preferences
    > .booknetic-cp-tab-footer .booknetic-cp-tab-footer-left {
        display: flex !important;
        align-items: center !important;

        width: auto !important;
        max-width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;

        visibility: visible !important;
        opacity: 1 !important;
    }

    /* -----------------------------------------------------
       PROFILE — SAVE + DELETE
       ----------------------------------------------------- */

    body.page-id-1180 #booknetic-tab-profile #booknetic_profile_save {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 118px !important;
        min-width: 118px !important;
        height: 40px !important;
        min-height: 40px !important;

        margin: 0 !important;
        padding: 0 16px !important;

        background:
            linear-gradient(180deg,#FFE66A 0%,#FFD700 50%,#E6B800 100%) !important;

        color: #000000 !important;
        -webkit-text-fill-color: #000000 !important;

        border: 1px solid #FFD700 !important;
        border-radius: 3px !important;

        font-family: Helvetica, Arial, sans-serif !important;
        font-size: 10px !important;
        font-weight: 700 !important;
        line-height: 1 !important;
        letter-spacing: .4px !important;
        text-transform: uppercase !important;

        visibility: visible !important;
        opacity: 1 !important;
    }

    body.page-id-1180 #booknetic-tab-profile #booknetic_profile_delete {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: auto !important;
        min-width: 145px !important;
        height: 40px !important;
        min-height: 40px !important;

        margin: 0 !important;
        padding: 0 15px !important;

        visibility: visible !important;
        opacity: 1 !important;
    }

    /* -----------------------------------------------------
       CHANGE PASSWORD
       ----------------------------------------------------- */

    body.page-id-1180
    #booknetic-tab-change-password
    #booknetic_change_password_save {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: auto !important;
        min-width: 165px !important;
        height: 40px !important;
        min-height: 40px !important;

        margin: 0 !important;
        padding: 0 18px !important;

        visibility: visible !important;
        opacity: 1 !important;
    }

    /* -----------------------------------------------------
       EMAIL / WORKFLOW PREFERENCES SAVE
       If Booknetic injects its native save button dynamically,
       keep it visible and in normal flow.
       ----------------------------------------------------- */

    body.page-id-1180 #booknetic-tab-email-preferences
    button.booknetic-profile-save.booknetic_cp_save_tenant_ep,
    body.page-id-1180 #booknetic-tab-email-preferences
    .booknetic_cp_save_tenant_ep {
        position: static !important;

        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 118px !important;
        min-width: 118px !important;
        max-width: none !important;

        height: 40px !important;
        min-height: 40px !important;

        margin: 14px 0 0 !important;
        padding: 0 16px !important;

        background:
            linear-gradient(180deg,#FFE66A 0%,#FFD700 50%,#E6B800 100%) !important;

        color: #000000 !important;
        -webkit-text-fill-color: #000000 !important;

        border: 1px solid #FFD700 !important;
        border-radius: 3px !important;

        font-family: Helvetica, Arial, sans-serif !important;
        font-size: 10px !important;
        font-weight: 700 !important;
        line-height: 1 !important;
        letter-spacing: .4px !important;
        text-transform: uppercase !important;

        visibility: visible !important;
        opacity: 1 !important;
        overflow: visible !important;

        z-index: 3 !important;
    }

    /*
     * Leave enough space below the preference controls so a dynamically
     * injected SAVE button cannot be hidden behind Check All.
     */
    body.page-id-1180 #booknetic-tab-email-preferences
    .booknetic_email_preferences_tab {
        padding-bottom: 100px !important;
    }
}

@media only screen and (max-width: 480px) {

    body.page-id-1180 #booknetic-tab-profile > .booknetic-cp-tab-footer,
    body.page-id-1180 #booknetic-tab-change-password > .booknetic-cp-tab-footer,
    body.page-id-1180 #booknetic-tab-email-preferences > .booknetic-cp-tab-footer {
        padding: 13px 14px 16px !important;
        gap: 8px !important;
    }

    body.page-id-1180 #booknetic-tab-profile #booknetic_profile_save {
        width: 105px !important;
        min-width: 105px !important;
        height: 38px !important;
        min-height: 38px !important;
    }

    body.page-id-1180 #booknetic-tab-profile #booknetic_profile_delete {
        min-width: 138px !important;
        height: 38px !important;
        min-height: 38px !important;
    }

    body.page-id-1180
    #booknetic-tab-change-password
    #booknetic_change_password_save {
        min-width: 155px !important;
        height: 38px !important;
        min-height: 38px !important;
    }

    body.page-id-1180 #booknetic-tab-email-preferences
    button.booknetic-profile-save.booknetic_cp_save_tenant_ep,
    body.page-id-1180 #booknetic-tab-email-preferences
    .booknetic_cp_save_tenant_ep {
        width: 105px !important;
        min-width: 105px !important;
        height: 38px !important;
        min-height: 38px !important;
    }
}

/* =========================================================
   MOBILE CUSTOMER ACCOUNT — V30
   WORKFLOW / NOTIFICATIONS SAVE FOOTER
   Exact live markup:
   <div class="booknetic-cp-tab-footer">
     <div class="booknetic-cp-tab-footer-left">
       <button type="button"
         class="booknetic-profile-save booknetic_cp_save_tenant_ep">
         SAVE
       </button>
     </div>
   </div>
   ========================================================= */

@media only screen and (max-width: 1000px) {

    /* Force the workflow footer itself back into normal flow */
    body.page-id-1180
    #booknetic-tab-email-preferences
    > div.booknetic-cp-tab-footer {
        position: static !important;

        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;

        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        height: auto !important;
        min-height: 68px !important;
        max-height: none !important;

        margin: 0 !important;
        padding: 14px 18px 18px !important;

        background: #050505 !important;
        border-top: 1px solid rgba(255,215,0,.18) !important;

        visibility: visible !important;
        opacity: 1 !important;

        overflow: visible !important;

        transform: none !important;
        clip: auto !important;
        clip-path: none !important;

        box-sizing: border-box !important;
        z-index: 5 !important;
    }

    /* Footer inner wrapper */
    body.page-id-1180
    #booknetic-tab-email-preferences
    > div.booknetic-cp-tab-footer
    > div.booknetic-cp-tab-footer-left {
        position: static !important;

        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;

        width: auto !important;
        max-width: 100% !important;

        height: auto !important;
        min-height: 0 !important;

        margin: 0 !important;
        padding: 0 !important;

        visibility: visible !important;
        opacity: 1 !important;

        overflow: visible !important;
        transform: none !important;
    }

    /* Exact workflow SAVE button */
    body.page-id-1180
    #booknetic-tab-email-preferences
    > div.booknetic-cp-tab-footer
    > div.booknetic-cp-tab-footer-left
    > button.booknetic-profile-save.booknetic_cp_save_tenant_ep {
        position: static !important;

        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 112px !important;
        min-width: 112px !important;
        max-width: 112px !important;

        height: 40px !important;
        min-height: 40px !important;
        max-height: 40px !important;

        margin: 0 !important;
        padding: 0 16px !important;

        background:
            linear-gradient(
                180deg,
                #FFE66A 0%,
                #FFD700 50%,
                #E6B800 100%
            ) !important;

        color: #000000 !important;
        -webkit-text-fill-color: #000000 !important;

        border: 1px solid #FFD700 !important;
        border-radius: 3px !important;

        box-shadow: none !important;

        font-family: Helvetica, Arial, sans-serif !important;
        font-size: 10px !important;
        font-weight: 700 !important;
        line-height: 1 !important;
        letter-spacing: .4px !important;
        text-align: center !important;
        text-transform: uppercase !important;

        visibility: visible !important;
        opacity: 1 !important;

        transform: none !important;
        pointer-events: auto !important;

        z-index: 6 !important;
    }

    /* Make sure the preferences body does not cover the footer */
    body.page-id-1180
    #booknetic-tab-email-preferences
    > .booknetic-cp-tab-body {
        position: relative !important;
        z-index: 1 !important;

        margin-bottom: 0 !important;
        padding-bottom: 18px !important;

        overflow: visible !important;
    }
}

@media only screen and (max-width: 480px) {

    body.page-id-1180
    #booknetic-tab-email-preferences
    > div.booknetic-cp-tab-footer {
        min-height: 62px !important;
        padding: 12px 14px 15px !important;
    }

    body.page-id-1180
    #booknetic-tab-email-preferences
    > div.booknetic-cp-tab-footer
    > div.booknetic-cp-tab-footer-left
    > button.booknetic-profile-save.booknetic_cp_save_tenant_ep {
        width: 104px !important;
        min-width: 104px !important;
        max-width: 104px !important;

        height: 38px !important;
        min-height: 38px !important;
        max-height: 38px !important;
    }
}

/* =========================================================
   MOBILE CUSTOMER ACCOUNT — V31
   FINAL TAB FOOTER FLOW FIX
   - Workflow SAVE moves below all notification rows / CHECK ALL
   - Change Password button moves directly below the form
   - Profile remains unchanged
   ========================================================= */

@media only screen and (max-width: 1000px) {

    /* -----------------------------------------------------
       CHANGE PASSWORD — remove inherited tall body/min-height
       ----------------------------------------------------- */

    body.page-id-1180
    #booknetic-tab-change-password.show {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;

        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;

        overflow: visible !important;
    }

    body.page-id-1180
    #booknetic-tab-change-password
    > .booknetic-cp-tab-body {
        order: 1 !important;

        position: static !important;

        display: block !important;

        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;

        flex: 0 0 auto !important;

        margin: 0 !important;
        padding-bottom: 22px !important;

        overflow: visible !important;
    }

    body.page-id-1180
    #booknetic-tab-change-password
    > .booknetic-cp-tab-body
    form,
    body.page-id-1180
    #booknetic-tab-change-password
    > .booknetic-cp-tab-body
    .row {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;

        margin-bottom: 0 !important;
    }

    body.page-id-1180
    #booknetic-tab-change-password
    > .booknetic-cp-tab-footer {
        order: 2 !important;

        position: static !important;

        margin: 0 !important;
        padding: 14px 18px 18px !important;

        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;

        flex: 0 0 auto !important;

        background: #050505 !important;
        border-top: 1px solid rgba(255,215,0,.18) !important;

        overflow: visible !important;
    }

    /* -----------------------------------------------------
       WORKFLOW / NOTIFICATIONS
       The preference body was visually overflowing its box,
       so the footer appeared halfway through the list.
       Make the body establish its own full content height.
       ----------------------------------------------------- */

    body.page-id-1180
    #booknetic-tab-email-preferences.show {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;

        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;

        overflow: visible !important;
    }

    body.page-id-1180
    #booknetic-tab-email-preferences
    > .booknetic-cp-tab-body {
        order: 1 !important;

        position: static !important;

        display: flow-root !important;

        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;

        flex: 0 0 auto !important;

        margin: 0 !important;
        padding-bottom: 18px !important;

        overflow: visible !important;
    }

    /*
     * The injected preference content must also size naturally.
     * This stops rows overflowing beyond the measured tab body.
     */
    body.page-id-1180
    #booknetic-tab-email-preferences
    > .booknetic-cp-tab-body
    > * {
        position: relative !important;

        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;

        overflow: visible !important;
    }

    /* Footer now comes after ALL workflow content */
    body.page-id-1180
    #booknetic-tab-email-preferences
    > .booknetic-cp-tab-footer {
        order: 2 !important;

        position: static !important;
        clear: both !important;

        width: 100% !important;

        margin: 0 !important;
        padding: 14px 18px 18px !important;

        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;

        flex: 0 0 auto !important;

        background: #050505 !important;
        border-top: 1px solid rgba(255,215,0,.18) !important;

        transform: none !important;
        overflow: visible !important;
        z-index: 1 !important;
    }

    /* Keep workflow SAVE compact and aligned under CHECK ALL */
    body.page-id-1180
    #booknetic-tab-email-preferences
    > .booknetic-cp-tab-footer
    > .booknetic-cp-tab-footer-left {
        width: auto !important;
        margin: 0 !important;
    }

    body.page-id-1180
    #booknetic-tab-email-preferences
    > .booknetic-cp-tab-footer
    .booknetic_cp_save_tenant_ep {
        position: static !important;

        width: 112px !important;
        min-width: 112px !important;
        max-width: 112px !important;

        height: 40px !important;
        min-height: 40px !important;

        margin: 0 !important;
    }
}

@media only screen and (max-width: 480px) {

    body.page-id-1180
    #booknetic-tab-change-password
    > .booknetic-cp-tab-body {
        padding-bottom: 18px !important;
    }

    body.page-id-1180
    #booknetic-tab-change-password
    > .booknetic-cp-tab-footer,
    body.page-id-1180
    #booknetic-tab-email-preferences
    > .booknetic-cp-tab-footer {
        padding: 12px 14px 15px !important;
    }

    body.page-id-1180
    #booknetic-tab-email-preferences
    > .booknetic-cp-tab-body {
        padding-bottom: 14px !important;
    }
}

/* =========================================================
   MOBILE CUSTOMER ACCOUNT — V32
   LOYALTY POINTS POPOVER FIX
   The purple points badge was clickable, but the loyalty
   popover was being clipped by mobile header overflow rules.
   ========================================================= */

@media only screen and (max-width: 1000px) {

    /* Keep the header above the account body when the popover opens */
    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-header {
        position: relative !important;
        z-index: 250 !important;
        overflow: visible !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-header-info {
        position: relative !important;
        z-index: 251 !important;
        overflow: visible !important;
    }

    /*
     * These were set to overflow:hidden to keep the mobile header neat.
     * That also clipped Booknetic's loyalty popover.
     */
    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-header-customer-card,
    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-header-customer-card-info,
    body.page-id-1180 #booknetic-customer-panel .booknetic-loyalty-points-container {
        position: relative !important;
        overflow: visible !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-header-customer-card {
        z-index: 252 !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-cp-header-customer-card-info {
        z-index: 253 !important;
    }

    body.page-id-1180 #booknetic-customer-panel .booknetic-loyalty-points-container {
        z-index: 254 !important;
    }

    /* Bring the actual loyalty panel above the sidebar/cards */
    body.page-id-1180 #booknetic-customer-panel .booknetic-customer-point-info {
        z-index: 999999 !important;
        max-width: min(320px, calc(100vw - 74px)) !important;
    }

    /* Keep name/email tidy even though their parent can now overflow */
    body.page-id-1180 #booknetic-customer-panel
    .booknetic-cp-header-customer-card-info h2,
    body.page-id-1180 #booknetic-customer-panel
    .booknetic-cp-header-customer-card-info > p {
        max-width: 100% !important;
        overflow: hidden !important;
        white-space: nowrap !important;
        text-overflow: ellipsis !important;
    }
}

@media only screen and (max-width: 480px) {

    body.page-id-1180 #booknetic-customer-panel .booknetic-customer-point-info {
        max-width: calc(100vw - 64px) !important;
    }
}

/* =========================================================
   MOBILE CUSTOMER ACCOUNT — V33
   LOYALTY POINTS — MATCH DESKTOP DESIGN
   Reasserts the locked desktop black / gold loyalty styling
   on mobile, overriding Booknetic's purple / white defaults.
   ========================================================= */

@media only screen and (max-width: 1000px) {

    /* Purple badge -> desktop black/gold badge */
    body.page-id-1180
    #booknetic-customer-panel
    .booknetic-customer-point-badge {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        min-height: 20px !important;

        margin: 0 !important;
        padding: 3px 8px !important;

        background: #090909 !important;
        background-image: none !important;

        color: #FFD700 !important;
        -webkit-text-fill-color: #FFD700 !important;

        border: 1px solid rgba(255,215,0,.50) !important;
        border-radius: 999px !important;

        box-shadow: none !important;

        font-family: Helvetica, Arial, sans-serif !important;
        font-size: 8px !important;
        font-weight: 600 !important;
        line-height: 12px !important;
    }

    /* Main points popover */
    body.page-id-1180
    #booknetic-customer-panel
    .booknetic-customer-point-info {
        width: 310px !important;
        max-width: calc(100vw - 78px) !important;

        padding: 18px 20px !important;

        background:
            linear-gradient(
                180deg,
                rgba(18,18,18,.995) 0%,
                rgba(6,6,6,.995) 100%
            ) !important;

        color: #FFFFFF !important;

        border: 1px solid rgba(255,215,0,.48) !important;
        border-radius: 8px !important;

        box-shadow:
            0 16px 36px rgba(0,0,0,.64),
            0 0 22px rgba(255,215,0,.07) !important;

        backdrop-filter: blur(12px) !important;
        -webkit-backdrop-filter: blur(12px) !important;
    }

    /* Text */
    body.page-id-1180
    #booknetic-customer-panel
    .booknetic-customer-point-info p {
        margin: 0 0 13px !important;

        color: #B8B8B8 !important;

        font-family: Helvetica, Arial, sans-serif !important;
        font-size: 13px !important;
        font-weight: 400 !important;
        line-height: 1.45 !important;
    }

    body.page-id-1180
    #booknetic-customer-panel
    .booknetic-customer-point-info p:last-child {
        margin-bottom: 0 !important;
    }

    body.page-id-1180
    #booknetic-customer-panel
    .booknetic-customer-point-info p span {
        color: #FFFFFF !important;
        -webkit-text-fill-color: #FFFFFF !important;

        font-weight: 700 !important;
    }

    /* Progress track */
    body.page-id-1180
    #booknetic-customer-panel
    .points-slider-wrapper {
        position: relative !important;

        width: 100% !important;
        height: 14px !important;

        margin: 4px 0 14px !important;

        background: rgba(255,255,255,.08) !important;

        border: 1px solid rgba(255,215,0,.16) !important;
        border-radius: 999px !important;

        box-shadow: none !important;
    }

    /* Filled progress */
    body.page-id-1180
    #booknetic-customer-panel
    .points-slider-filled {
        height: 100% !important;

        background:
            linear-gradient(
                90deg,
                #B79600 0%,
                #FFD700 58%,
                #FFF1A8 100%
            ) !important;

        border-radius: 999px !important;

        box-shadow: 0 0 10px rgba(255,215,0,.22) !important;
    }

    /* Loyalty marker */
    body.page-id-1180
    #booknetic-customer-panel
    .points-slider-thumb {
        width: 26px !important;
        height: 26px !important;

        background: #070707 !important;

        border: 1px solid #FFD700 !important;
        border-radius: 50% !important;

        box-shadow:
            0 0 0 3px rgba(255,215,0,.10),
            0 0 14px rgba(255,215,0,.30) !important;

        overflow: visible !important;
    }

    body.page-id-1180
    #booknetic-customer-panel
    .points-slider-thumb img {
        opacity: 0 !important;
        visibility: hidden !important;
    }

    body.page-id-1180
    #booknetic-customer-panel
    .points-slider-thumb::before {
        content: "" !important;

        position: absolute !important;
        inset: 4px !important;

        display: block !important;

        background-image:
            url("https://damianphilpott.com/wp-content/plugins/booknetic-loyalty-points/assets/frontend/icons/coin.svg") !important;
        background-repeat: no-repeat !important;
        background-position: center !important;
        background-size: contain !important;

        pointer-events: none !important;
    }
}

@media only screen and (max-width: 480px) {

    body.page-id-1180
    #booknetic-customer-panel
    .booknetic-customer-point-info {
        width: 290px !important;
        max-width: calc(100vw - 64px) !important;

        padding: 16px 17px !important;
    }

    body.page-id-1180
    #booknetic-customer-panel
    .booknetic-customer-point-info p {
        font-size: 12px !important;
    }
}