/* 24 Hosting client area (new24) - loaded by includes/hooks/new24_minimal.php with ?v=<mtime>. Design tokens from the new www.24.ie WordPress theme */
@font-face { font-family: "Inter"; font-style: normal; font-weight: 100 900; font-display: swap; src: url(../fonts/inter.woff2) format("woff2"); }
@font-face { font-family: "Bricolage Grotesque"; font-style: normal; font-weight: 200 800; font-display: swap; src: url(../fonts/bricolage-grotesque.woff2) format("woff2"); }

:root {
    --h24-accent: #7a1f2e;        /* --c-accent 122 31 46 */
    --h24-accent-dark: #5e1723;
    --h24-footer: #3b0d16;        /* --c-footer 59 13 22 */
    --h24-surface-alt: #faf4f2;   /* --c-surface-alt 250 244 242 */
    --h24-line: #f1e4e1;          /* --c-line 241 228 225 */
    --h24-line-strong: #d1d5db;   /* --c-line-strong 209 213 219 */
    --h24-ink: #111827;           /* --c-ink 17 24 39 */
    --h24-ink-body: #374151;      /* --c-ink-body 55 65 81 */
    --h24-ink-muted: #4b5563;     /* --c-ink-muted 75 85 99 */
    --h24-font-body: Inter, ui-sans-serif, system-ui, sans-serif;
    --h24-font-display: "Bricolage Grotesque", Inter, ui-sans-serif, system-ui, sans-serif;
}

body { font-family: var(--h24-font-body); color: var(--h24-ink-body); background: var(--h24-surface-alt); }
h1, h2, h3, h4, h5, .h1, .h2, .h3, .h4, .h5, .card-title, .primary-content h1 { font-family: var(--h24-font-display); color: var(--h24-ink); }
a { color: var(--h24-accent); }
a:hover, a:focus { color: var(--h24-accent-dark); }

/* buttons: pill shape, accent colour */
.btn { border-radius: 9999px; }
.btn-primary, .btn-success, .btn-order-now, .btn-checkout {
    background-color: var(--h24-accent); border-color: var(--h24-accent); color: #fff;
}
.btn-primary:hover, .btn-primary:focus, .btn-success:hover, .btn-success:focus,
.btn-primary:not(:disabled):not(.disabled):active, .btn-success:not(:disabled):not(.disabled):active {
    background-color: var(--h24-accent-dark); border-color: var(--h24-accent-dark); color: #fff;
}
.btn-outline-primary { color: var(--h24-accent); border-color: var(--h24-accent); }
.btn-outline-primary:hover { background-color: var(--h24-accent); border-color: var(--h24-accent); color: #fff; }

/* cards and panels */
.card { border-color: var(--h24-line); border-radius: .75rem; }
.list-group-item.active, .page-item.active .page-link,
.nav-pills .nav-link.active, .custom-control-input:checked ~ .custom-control-label::before {
    background-color: var(--h24-accent); border-color: var(--h24-accent);
}
.page-link { color: var(--h24-accent); }


/* footer */
footer.footer { background-color: var(--h24-footer); color: #f2eaeb; }
footer.footer a, footer.footer .nav-link { color: #f2eaeb; }
footer.footer a:hover { color: #fff; }

/* ---- header (header.tpl) ---- */
.h24-header { background: transparent; }
.h24-topbar { background-color: var(--h24-footer); }
.h24-sitebar { background-color: var(--h24-accent); color: #fff; }
.h24-sitebar-inner { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; min-height: 80px; }
.h24-logo img { display: block; height: 48px; width: auto; }
@media (min-width: 768px) { .h24-logo img { height: 56px; } }
.h24-sitenav ul { display: flex; gap: 2rem; list-style: none; margin: 0; padding: 0; }
.h24-sitenav a { color: #fff; font-weight: 500; text-decoration: none; }
.h24-sitenav a:hover, .h24-sitenav a:focus { color: rgba(255,255,255,.75); }
.h24-actions { display: flex; align-items: center; gap: .75rem; }
.h24-cart { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 9999px; color: #fff; }
.h24-cart:hover, .h24-cart:focus { background: rgba(255,255,255,.1); color: #fff; }
.h24-cart .badge { position: absolute; top: 2px; right: 0; background: #fff; color: var(--h24-accent); border-radius: 9999px; font-size: .7rem; }
.h24-btn-quote { align-items: center; border: 2px solid #fff; background: #fff; color: var(--h24-footer); border-radius: 9999px; padding: .5rem 1rem; font-size: .875rem; font-weight: 600; text-decoration: none; }
.h24-btn-quote:hover, .h24-btn-quote:focus { background: transparent; color: #fff; text-decoration: none; }
.h24-burger { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 0; border-radius: .5rem; background: transparent; color: #fff; }
.h24-burger:hover { background: rgba(255,255,255,.1); }
.h24-clientbar { background: #fff; border-bottom: 1px solid var(--h24-line); }
.h24-clientbar .navbar-nav .nav-link { color: var(--h24-ink); font-weight: 500; }
.h24-clientbar .navbar-nav .nav-link:hover, .h24-clientbar .navbar-nav .active > .nav-link { color: var(--h24-accent); }
.h24-sitenav-mobile { border-bottom: 1px solid var(--h24-line); margin-bottom: .5rem; width: 100%; }
/* same width as the website's .site-container */
.h24-sitebar-inner.container { max-width: 1440px; padding-left: 1.25rem; padding-right: 1.25rem; }
@media (min-width: 768px) { .h24-sitebar-inner.container { padding-left: 2rem; padding-right: 2rem; } }
@media (min-width: 1024px) { .h24-sitebar-inner.container { padding-left: 2.5rem; padding-right: 2.5rem; } }

/* ---- mobile menu (below 1200px the WHMCS bar collapses behind the burger) ---- */
.h24-burger .h24-icon-close { display: none; }
.h24-burger:not(.collapsed) .h24-icon-open { display: none; }
.h24-burger:not(.collapsed) .h24-icon-close { display: inline-block; }
.h24-burger:focus { outline: none; }
.h24-burger:focus-visible { outline: none; box-shadow: 0 0 0 2px #fff; }
.h24-mobile-cta { padding: 1.25rem 0 2rem; }
.h24-btn-primary { display: flex; width: 100%; align-items: center; justify-content: center; border: 2px solid var(--h24-accent);
    background: var(--h24-accent); color: #fff; border-radius: 9999px; padding: .75rem 1.5rem; font-weight: 600; text-decoration: none; }
.h24-btn-primary:hover, .h24-btn-primary:focus { background: transparent; color: var(--h24-accent); text-decoration: none; }

@media (max-width: 1199.98px) {
    .h24-clientbar { padding-top: 0; padding-bottom: 0; }
    .h24-clientbar .container { max-width: none; padding-left: 1.25rem; padding-right: 1.25rem; }
    .h24-clientbar .navbar-collapse { padding-top: .25rem; }
    .h24-clientbar .navbar-nav { width: 100%; margin: 0; }
    .h24-clientbar .navbar-nav > li { border-bottom: 1px solid var(--h24-line); }
    .h24-clientbar .navbar-nav .nav-link { font-size: 1.125rem; font-weight: 500; padding: 1rem 0; color: var(--h24-ink); }
    .h24-clientbar .navbar-nav .nav-link:hover, .h24-clientbar .navbar-nav .nav-link:focus { color: var(--h24-accent); }
    .h24-sitenav-mobile { border-bottom: 0; margin-bottom: 0; }
    /* Account etc.: show the dropdown as an open list instead of a popup */
    .h24-clientbar .dropdown-toggle::after { display: none; }
    .h24-clientbar .dropdown-toggle { font-family: var(--h24-font-display); font-size: .875rem !important; font-weight: 600 !important;
        text-transform: uppercase; letter-spacing: .1em; color: var(--h24-accent) !important; padding-bottom: .25rem !important; pointer-events: none; }
    .h24-clientbar .dropdown-menu { display: block; position: static; float: none; border: 0; box-shadow: none; background: transparent;
        padding: 0 0 .75rem; margin: 0; }
    .h24-clientbar .dropdown-menu .dropdown-item { padding: .6rem 0; font-size: 1.0625rem; color: var(--h24-ink); background: transparent; }
    .h24-clientbar .dropdown-menu .dropdown-item:hover, .h24-clientbar .dropdown-menu .dropdown-item:focus { color: var(--h24-accent); }
    .h24-clientbar .dropdown-divider { border-color: var(--h24-line); }
}
.h24-header a.h24-btn-primary { color: #fff; }
.h24-header a.h24-btn-primary:hover, .h24-header a.h24-btn-primary:focus { color: var(--h24-accent); }
@media (max-width: 1199.98px) {
    .h24-header .h24-clientbar .dropdown-menu .dropdown-item { padding-left: 0; padding-right: 0; }
}
.h24-mobile-cta a.h24-btn-primary { color: #fff !important; }
.h24-mobile-cta a.h24-btn-primary:hover, .h24-mobile-cta a.h24-btn-primary:focus { color: var(--h24-accent) !important; }
@media (max-width: 1199.98px) {
    header.header .h24-clientbar .navbar-collapse { padding-left: 0; padding-right: 0; }
}

/* mobile menu v2: overlay instead of pushing the page down; roomier Account section */
@media (max-width: 1199.98px) {
    header.header.h24-header { position: relative; z-index: 1030; }
    header.header .h24-clientbar { position: absolute; top: 100%; left: 0; right: 0; border-bottom: 0; background: transparent; }
    header.header .h24-clientbar .navbar-collapse { background: #fff; padding: .25rem 1.25rem 0;
        max-height: calc(100vh - 80px); overflow-y: auto; box-shadow: 0 24px 48px -12px rgba(17, 24, 39, .25); }
    header.header .h24-clientbar .navbar-collapse.show, header.header .h24-clientbar .navbar-collapse.collapsing { border-top: 1px solid var(--h24-line); }
    /* Account (and other dropdown groups): heading with breathing room, items like the main links */
    header.header .h24-clientbar .dropdown-toggle { padding: 1.5rem 0 .5rem !important; }
    header.header .h24-clientbar .dropdown-menu { padding: 0; }
    header.header .h24-clientbar .navbar-nav > li.dropdown { border-bottom: 1px solid var(--h24-line); }
    header.header .h24-clientbar .dropdown-divider { display: none; }
}
/* mobile menu v3: full-width, full-height panel; WHMCS puts .dropdown-item on both <li> and <a> */
@media (max-width: 1199.98px) {
    header.header .h24-clientbar > .container { max-width: none; padding: 0; }
    header.header .h24-clientbar .navbar-collapse.show { height: calc(100vh - 80px); }
    header.header .h24-clientbar .dropdown-menu > li.dropdown-item { padding: 0 !important; border: 0; margin: 0; background: transparent; }
    header.header .h24-clientbar .dropdown-menu > li > a.dropdown-item { display: block; font-size: 1.125rem; font-weight: 500;
        padding: 1rem 0 !important; border-top: 1px solid var(--h24-line); color: var(--h24-ink); background: transparent; }
    header.header .h24-clientbar .dropdown-menu > li > a.dropdown-item:hover { color: var(--h24-accent); }
    header.header .h24-clientbar .navbar-nav > li.dropdown { border-bottom: 0; }
    header.header .h24-clientbar .navbar-nav > li.dropdown > .dropdown-toggle { display: block; padding: 1.75rem 0 .75rem !important; }
}

/* ---- client area dashboard: one accent colour instead of Twenty-One's rainbow ---- */
.tiles .tile .highlight { background-color: var(--h24-accent) !important; }
.tiles .tile i { color: rgba(122, 31, 46, .12); }
.tiles .tile .stat { color: var(--h24-accent); font-family: var(--h24-font-display); }
.tiles .tile:hover { background-color: #fff; }
[class*="card-accent-"] { border-top: 3px solid var(--h24-accent) !important; }
.card-header .btn.btn-default[class*="bg-color-"] { background: transparent !important; color: var(--h24-accent) !important;
    border: 1px solid var(--h24-accent); border-radius: 9999px; }
.card-header .btn.btn-default[class*="bg-color-"]:hover { background: var(--h24-accent) !important; color: #fff !important; }
.card-header .card-title { font-size: 1.125rem; }
.master-breadcrumb { background: transparent; }

/* mobile menu v4: plain top-level links (e.g. Dashboard) styled like the rest; logged in: client area first */
@media (max-width: 1199.98px) {
    header.header .h24-clientbar .navbar-collapse { display: flex; flex-direction: column; }
    header.header .h24-clientbar .navbar-collapse:not(.show):not(.collapsing) { display: none; }
    header.header .h24-clientbar .navbar-nav > li > a:not(.dropdown-toggle) { display: block; font-size: 1.125rem; font-weight: 500;
        padding: 1rem 0 !important; color: var(--h24-ink); }
    header.header .h24-clientbar .navbar-nav > li > a:not(.dropdown-toggle):hover { color: var(--h24-accent); }
    header.header .h24-clientbar .navbar-nav > li.dropdown + li.dropdown > .dropdown-toggle { padding-top: 1.25rem !important; }
    header.h24-loggedin .h24-sitenav-mobile { order: 3; margin-top: .5rem; }
    header.h24-loggedin .h24-mobile-cta { order: 4; }
    .h24-menu-heading { font-family: var(--h24-font-display); font-size: .875rem; font-weight: 600; text-transform: uppercase;
        letter-spacing: .1em; color: var(--h24-accent); padding: 1.5rem 0 .5rem; border-bottom: 1px solid var(--h24-line); }
}
@media (max-width: 1199.98px) { header.header .h24-clientbar .navbar-collapse { align-items: stretch; } }

/* ---- accessibility ---- */
.h24-skip-link { position: absolute; left: 1rem; top: -100px; z-index: 2000; background: #fff; color: var(--h24-accent);
    padding: .75rem 1.25rem; border-radius: 9999px; font-weight: 600; box-shadow: 0 4px 16px rgba(0,0,0,.2); }
.h24-skip-link:focus { top: 1rem; }
#main-body:focus { outline: none; }
/* visible keyboard focus everywhere (mouse clicks stay clean) */
a:focus-visible, button:focus-visible, .btn:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible,
[tabindex]:focus-visible { outline: 3px solid var(--h24-accent); outline-offset: 2px; box-shadow: none; }
.h24-sitebar a:focus-visible, .h24-sitebar button:focus-visible, footer.footer a:focus-visible { outline-color: #fff; }
/* links inside text are underlined, not only coloured (WCAG 1.4.1) */
.primary-content p a, .primary-content li a:not(.btn):not(.dropdown-item):not(.list-group-item), .card-body p a { text-decoration: underline; text-underline-offset: 2px; }
/* contrast fixes found by axe */
.breadcrumb { background: transparent; }
.breadcrumb-item, .breadcrumb-item.active, .breadcrumb-item + .breadcrumb-item::before { color: var(--h24-ink-muted); }
#checkout, .btn-checkout { background-color: var(--h24-accent) !important; border-color: var(--h24-accent) !important; color: #fff !important; }
#checkout:hover, .btn-checkout:hover { background-color: var(--h24-accent-dark) !important; border-color: var(--h24-accent-dark) !important; }
.text-muted { color: var(--h24-ink-muted) !important; }
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
.field-help-text, .form-text, small.text-muted { color: var(--h24-ink-muted) !important; }
.btn-checkout.disabled, #checkout.disabled { opacity: 1; background-color: #4b5563 !important; border-color: #4b5563 !important; color: #fff !important; cursor: not-allowed; }

/* ---- order form (standard_cart): brand colours instead of navy / grey / green ---- */
body #order-standard_cart .header-lined h1, body #order-standard_cart h1 { font-family: var(--h24-font-display); color: var(--h24-ink); }
body #order-standard_cart .sub-heading { border-top-color: var(--h24-line); }
body #order-standard_cart .sub-heading span, body #order-standard_cart .sub-heading-borderless span { color: var(--h24-accent);
    background: var(--h24-surface-alt); font-family: var(--h24-font-display); font-weight: 600; }
/* cart table */
body #order-standard_cart .view-cart-items-header { background-color: var(--h24-accent); border-radius: .75rem .75rem 0 0; font-weight: 600; }
body #order-standard_cart .view-cart-items { border-bottom: 2px solid var(--h24-accent); background: #fff; }
body #order-standard_cart .view-cart-items .item { border-bottom: 1px solid var(--h24-line); }
body #order-standard_cart .empty-cart .btn { background-color: var(--h24-accent); border-radius: 0 0 .5rem .5rem; }
body #order-standard_cart .view-cart-tabs .nav-tabs a { color: var(--h24-accent); }
body #order-standard_cart .view-cart-promotion-code { border-color: var(--h24-line); border-radius: .5rem; }
/* order summary box */
body #order-standard_cart .order-summary { background-color: var(--h24-footer); border-bottom: 3px solid var(--h24-footer); border-radius: .75rem; overflow: hidden; }
body #order-standard_cart .order-summary h2 { font-family: var(--h24-font-display); font-weight: 600; }
body #order-standard_cart .order-summary .summary-container { background: #fff; color: var(--h24-ink-body); }
body #order-standard_cart .order-summary .total-due-today .amt { color: var(--h24-ink); font-family: var(--h24-font-display); font-weight: 600; }
body #order-standard_cart .order-summary .subtotal, body #order-standard_cart .order-summary .bordered-totals,
body #order-standard_cart .order-summary .summary-totals { border-color: var(--h24-line); }
body #order-standard_cart .order-summary .recurring-charges { color: var(--h24-ink-muted); }
body #order-standard_cart .order-summary .btn-continue-shopping { color: var(--h24-accent); text-decoration: underline; }
body #order-standard_cart .btn-checkout { border-radius: 9999px; font-weight: 600; }
/* products, addons and options */
body #order-standard_cart .products .product, body #order-standard_cart .panel-addon, body #order-standard_cart .card,
body #order-standard_cart .product-info { border-color: var(--h24-line); border-radius: .75rem; }
body #order-standard_cart .product-info { background: #fff; }
body #order-standard_cart .product-info .product-title { font-family: var(--h24-font-display); color: var(--h24-ink); }
body #order-standard_cart .panel-addon .panel-add, body #order-standard_cart .panel-addon-selected .panel-add { background-color: var(--h24-accent); }
body #order-standard_cart .panel-addon-selected { border-color: var(--h24-accent); }
body #order-standard_cart .field, body #order-standard_cart .form-control { border-color: var(--h24-line-strong, #d1d5db); color: var(--h24-ink); border-radius: .5rem; }
body #order-standard_cart .form-control:focus { border-color: var(--h24-accent); box-shadow: 0 0 0 3px rgba(122, 31, 46, .15); }
/* domain search results */
body div.domainresults div:not(.btn-group) { background-color: var(--h24-surface-alt); color: var(--h24-ink); border-radius: .75rem .75rem 0 0; }
body .domain-checker-available { color: #166534; }   /* dark green: 7:1 on white */
body .domain-checker-invalid, .domain-checker-unavailable { color: #b91c1c; }
body .spotlight-tld { border-color: var(--h24-line); border-radius: .75rem; color: var(--h24-ink); }
body .spotlight-tld .btn:not(.domain-contact-support), body .suggested-domains .btn:not(.domain-contact-support) {
    background-color: var(--h24-accent); border-color: var(--h24-accent); border-radius: 9999px; }
body .domain-promo-box { background: #fff; border-color: var(--h24-line); border-radius: .75rem; }
body .domain-renewals, body .service-renewals, body .domain-renewals .domain-renewal, body .service-renewals .service-renewal { border-color: var(--h24-line); }
/* order form v2 - standard_cart's CSS loads after ours, so these need the extra body/#id prefix */
body .domain-checker-container { background: var(--h24-accent); border-radius: 1rem; }
body .domain-checker-container .domain-checker-bg { background-image: none; padding: 56px 0; }
@media (max-width: 992px) { body .domain-checker-container .domain-checker-bg { padding: 28px 0; } }
body .domain-checker-container .input-group-box { border-radius: .75rem; }
body .domain-checker-container .input-group-box .btn { background: var(--h24-accent); border-color: var(--h24-accent); border-radius: 9999px !important; }
body #DomainSearchResults .primary-domain-header, body .suggested-domains .card-header, body .suggested-domains .panel-heading {
    border-bottom: 2px solid var(--h24-accent); background: transparent; font-weight: 600; color: var(--h24-ink); }
body .spotlight-tld .btn:not(.domain-contact-support), body .domain-lookup-result .btn-add-to-cart,
body .suggested-domains .btn-add-to-cart, body #order-standard_cart .btn-add-to-cart {
    background-color: var(--h24-accent); border-color: var(--h24-accent); color: #fff; border-radius: 9999px; }
body .spotlight-tld .btn:not(.domain-contact-support):hover, body #order-standard_cart .btn-add-to-cart:hover {
    background-color: var(--h24-accent-dark); border-color: var(--h24-accent-dark); color: #fff; }
body #order-standard_cart .btn-add-to-cart.checkout, body .domain-lookup-result .btn-add-to-cart.checkout { background-color: #166534; border-color: #166534; }
body .domain-checker-available, body #order-standard_cart .domain-checker-available { color: #166534; }
/* radio buttons / checkboxes (iCheck sprites are blue/green images) drawn in CSS instead */
body .iradio_square-blue, body .icheckbox_square-blue, body .icheckbox_square-green {
    background: #fff; border: 2px solid #d1d5db; width: 22px; height: 22px; }
body .iradio_square-blue { border-radius: 50%; }
body .icheckbox_square-blue, body .icheckbox_square-green { border-radius: 6px; }
body .iradio_square-blue.hover, body .icheckbox_square-blue.hover, body .icheckbox_square-green.hover { border-color: var(--h24-accent); }
body .iradio_square-blue.checked { border-color: var(--h24-accent); background: var(--h24-accent); box-shadow: inset 0 0 0 4px #fff; }
body .icheckbox_square-blue.checked, body .icheckbox_square-green.checked { border-color: var(--h24-accent);
    background: var(--h24-accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2.5' d='M3.5 8.5l3 3 6-7'/%3E%3C/svg%3E") center/14px no-repeat; }
body .iradio_square-blue.disabled, body .icheckbox_square-blue.disabled { opacity: .5; }
body #order-standard_cart .panel-addon .panel-add, body #order-standard_cart .panel-addon-selected .panel-add { background-color: var(--h24-accent); }
/* order form v3 - contrast fixes on the domain search page (axe) */
body .spotlight-tld { color: var(--h24-ink); }
body .spotlight-tld .spotlight-tld-hot, body .spotlight-tld .spotlight-tld-new, body .spotlight-tld .spotlight-tld-sale {
    background-color: #b91c1c; color: #fff; }
body .spotlight-tld .spotlight-tld-new { background-color: #166534; }
body .domain-lookup-primary-loader, body #primaryLookupSearching, body .suggested-domains .domain-lookup-suggestions-loader,
body .suggested-domains .domain-lookup-suggestions-message, body #suggestionsLoader { color: var(--h24-ink-muted); opacity: 1; background-color: #fff; }
body .domain-suggestions-warning, body .domain-suggestions-warning p { color: var(--h24-ink-muted); }
body .text-warning { color: #92400e !important; }
body .domain-promo-box .small, body .domain-promo-box small { color: var(--h24-ink-muted); }
body .suggested-domains .panel-heading, body .suggested-domains .card-header { color: var(--h24-ink); background-color: #fff; }
