/*
Theme Name: SonSec
Theme URI: https://sonsec.co.za
Author: Son Security Systems (Pty) Ltd
Author URI: https://sonsec.co.za
Description: Custom WordPress theme for Son Security Systems (Pty) Ltd.
Version: 2.0.22 RC7.18.66
Requires at least: 6.6
Tested up to: 6.8
Requires PHP: 8.2
License: Proprietary
Text Domain: sonsec
*/

:root{
    --sonsec-primary:#3333FF;
    --sonsec-accent:#39FF14;
    --sonsec-background:#F4F4F4;
    --sonsec-text:#222222;
    --sonsec-container:1840px;
    --sonsec-container-padding:clamp(16px,2vw,32px);
    --sonsec-radius-sm:10px;
    --sonsec-radius-md:14px;
    --sonsec-radius-lg:16px;
    --sonsec-radius-xl:20px;
    --sonsec-radius-pill:999px;
    --sonsec-shadow-xs:0 8px 18px rgba(15,23,42,.05);
    --sonsec-shadow-sm:0 12px 28px rgba(15,23,42,.06);
    --sonsec-shadow-md:0 16px 36px rgba(15,23,42,.08);
    --sonsec-shadow-lg:0 22px 46px rgba(15,23,42,.13);
    --sonsec-transition-fast:150ms ease;
    --sonsec-transition:200ms ease;
    --sonsec-transition-slow:250ms ease;
    --sonsec-button-height:48px;
    --sonsec-card-padding-sm:18px;
    --sonsec-card-padding-md:22px;
    --sonsec-card-padding-lg:26px;
    --sonsec-section-spacing:64px;
    --sonsec-badge-min-height:30px;
    --sonsec-badge-radius:999px;
}

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
    scroll-padding-bottom:calc(112px + env(safe-area-inset-bottom, 0px));
}

body{
    background:var(--sonsec-background);
    color:var(--sonsec-text);
    font-family:Inter,Arial,sans-serif;
    font-size:16px;
    line-height:1.6;
}

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

a{
    color:var(--sonsec-primary);
    text-decoration:none;
}

a:hover{
    text-decoration:underline;
}

.sonsec-whatsapp-icon{
    width:1.1em;
    height:1.1em;
    flex:0 0 auto;
    margin-right:0;
}

.sonsec-contact-icon,
.sonsec-persistent-contact__icon{
    width:1.15em;
    height:1.15em;
    flex:0 0 auto;
}

.sonsec-contact-icon path,
.sonsec-persistent-contact__icon path{
    fill:none;
    stroke:currentColor;
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.sonsec-contact-icon path[fill],
.sonsec-persistent-contact__icon path[fill]{
    fill:currentColor;
    stroke:none;
}

.hero-contact a{
    display:inline-flex;
    align-items:center;
    gap:8px;
}

.sonsec-persistent-contact{
    position:fixed;
    right:clamp(16px,2vw,28px);
    bottom:calc(30px + env(safe-area-inset-bottom, 0px));
    z-index:1200;
    pointer-events:none;
}

.sonsec-persistent-contact__desktop,
.sonsec-persistent-contact__mobile{
    pointer-events:auto;
}

.sonsec-persistent-contact__desktop{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    min-height:46px;
    padding:12px 17px;
    border:1px solid rgba(57,255,20,.55);
    border-radius:var(--sonsec-radius-pill);
    background:#128C7E;
    color:#FFFFFF;
    box-shadow:0 16px 36px rgba(7,19,41,.24),0 0 0 1px rgba(255,255,255,.16) inset;
    font-size:.95rem;
    font-weight:900;
    line-height:1;
    text-decoration:none;
    white-space:nowrap;
    transition:
        transform var(--sonsec-transition-fast),
        box-shadow var(--sonsec-transition-fast),
        border-color var(--sonsec-transition-fast),
        color var(--sonsec-transition-fast);
}

.sonsec-persistent-contact__desktop:hover,
.sonsec-persistent-contact__desktop:focus-visible{
    color:#FFFFFF;
    border-color:#39FF14;
    background:#075E54;
    box-shadow:0 18px 42px rgba(7,19,41,.3),0 0 0 1px rgba(57,255,20,.2) inset;
    text-decoration:none;
    transform:translateY(-1px);
}

.sonsec-persistent-contact__desktop:focus-visible,
.sonsec-persistent-contact__action:focus-visible{
    outline:3px solid rgba(57,255,20,.45);
    outline-offset:3px;
}

.admin-bar .sonsec-persistent-contact{
    bottom:calc(126px + env(safe-area-inset-bottom, 0px));
}

.sonsec-persistent-contact__mobile{
    display:none;
}

@media (max-width:768px){
    body{
        padding-bottom:calc(100px + env(safe-area-inset-bottom, 0px));
    }

    button.cookieadmin_re_consent{
        left:12px;
        bottom:calc(94px + env(safe-area-inset-bottom, 0px)) !important;
        z-index:99999;
    }

    .cookieadmin_law_container{
        bottom:calc(94px + env(safe-area-inset-bottom, 0px)) !important;
        max-height:calc(100vh - 118px - env(safe-area-inset-bottom, 0px));
        overflow:auto;
    }

    .sonsec-persistent-contact{
        right:12px;
        bottom:calc(10px + env(safe-area-inset-bottom, 0px));
        left:12px;
        width:auto;
    }

    .admin-bar .sonsec-persistent-contact{
        bottom:calc(10px + env(safe-area-inset-bottom, 0px));
    }

    .sonsec-persistent-contact__desktop{
        display:none;
    }

    .sonsec-persistent-contact__mobile{
        display:grid;
        grid-template-columns:repeat(3,minmax(0,1fr));
        gap:1px;
        min-height:66px;
        overflow:hidden;
        border:1px solid rgba(15,23,42,.12);
        border-radius:16px;
        background:#FFFFFF;
        box-shadow:0 16px 42px rgba(15,23,42,.2);
    }

    .sonsec-persistent-contact__action{
        display:flex;
        flex-direction:column;
        align-items:center;
        justify-content:center;
        gap:5px;
        min-width:0;
        min-height:64px;
        padding:8px 6px;
        color:#0F172A;
        font-size:.76rem;
        font-weight:900;
        line-height:1.1;
        text-align:center;
        text-decoration:none;
        background:#FFFFFF;
        transition:
            background-color var(--sonsec-transition-fast),
            color var(--sonsec-transition-fast);
    }

    .sonsec-persistent-contact__action:hover,
    .sonsec-persistent-contact__action:focus-visible{
        color:#3333FF;
        background:#F8FAFC;
        text-decoration:none;
    }

    .sonsec-persistent-contact__action--whatsapp{
        color:#128C7E;
    }

    .sonsec-persistent-contact__icon{
        width:1.25rem;
        height:1.25rem;
    }

    .sonsec-persistent-contact__action span{
        display:block;
        max-width:100%;
        overflow-wrap:anywhere;
    }
}

@media (min-width:769px){
    .sonsec-persistent-contact__desktop{
        display:inline-flex;
    }
}

@media (prefers-reduced-motion:reduce){
    .sonsec-persistent-contact__desktop,
    .sonsec-persistent-contact__action{
        transition:none;
    }
}

.container{
    width:100%;
    max-width:var(--sonsec-container);
    padding-inline:var(--sonsec-container-padding);
    margin-inline:auto;
}

:where(.button, .product-page__button, .contact-placeholder__button, .product-card__button, .product-knowledge__cta-actions a, .product-document-card__button, .project-page__button, .project-card__button, .project-cta-panel__button){
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:var(--sonsec-button-height);
    padding:12px 18px;
    border-radius:var(--sonsec-radius-sm);
    font-weight:700;
    text-decoration:none;
    transition:
        transform var(--sonsec-transition),
        background-color var(--sonsec-transition),
        border-color var(--sonsec-transition),
        color var(--sonsec-transition),
        box-shadow var(--sonsec-transition);
}

.product-page__button--secondary{
    background:#FFFFFF;
    border:1px solid rgba(0,87,184,.18);
    color:var(--sonsec-primary);
    box-shadow:none;
}

.product-page__button--secondary:hover,
.product-page__button--secondary:focus-visible{
    background:rgba(0,87,184,.05);
    border-color:rgba(0,87,184,.28);
    box-shadow:none;
    color:var(--sonsec-primary);
}

:where(.product-page__intro-panel, .product-page__credential-note, .product-page__image, .product-page__section, .product-page__note-card, .product-page__feature-card, .product-page__application-card, .product-page__insight-card, .product-knowledge__card, .product-knowledge__product-card, .product-knowledge__info-panel, .product-knowledge__cta-panel, .product-knowledge__credential-panel, .product-card, .product-document-card, .contact-placeholder__card, .services li, .project-card, .project-page__panel, .project-page__section, .project-landing__panel, .project-landing__intro, .project-page__hero-copy, .project-page__hero-panel, .project-cta-panel){
    background:#FFFFFF;
    border:1px solid rgba(15,23,42,.08);
    border-radius:var(--sonsec-radius-lg);
    box-shadow:var(--sonsec-shadow-sm);
    transition:
        transform var(--sonsec-transition),
        box-shadow var(--sonsec-transition),
        border-color var(--sonsec-transition);
}

:where(.product-page__intro-status, .product-card__status, .product-document-card__status, .product-knowledge__filters a, .product-knowledge__tags span, .project-page__badge, .project-card__badge, .project-card__status, .project-page__chips span, .project-page__chips a, .project-cta-panel__kicker){
    display:inline-flex;
    align-items:center;
    min-height:var(--sonsec-badge-min-height);
    padding:5px 10px;
    border-radius:var(--sonsec-badge-radius);
    font-size:.78rem;
    font-weight:800;
    letter-spacing:.04em;
    text-transform:uppercase;
}

:where(input[type="text"], input[type="email"], input[type="tel"], input[type="search"], input[type="url"], input[type="password"], textarea, select){
    width:100%;
    min-height:var(--sonsec-button-height);
    padding:12px 14px;
    border:1px solid #CBD5E1;
    border-radius:var(--sonsec-radius-sm);
    background:#FFFFFF;
    color:var(--sonsec-text);
    font:inherit;
    transition:
        border-color var(--sonsec-transition),
        box-shadow var(--sonsec-transition),
        background-color var(--sonsec-transition);
}

:where(input[type="text"], input[type="email"], input[type="tel"], input[type="search"], input[type="url"], input[type="password"], textarea, select):focus-visible{
    outline:3px solid rgba(0,87,184,.18);
    outline-offset:2px;
    border-color:var(--sonsec-primary);
}

:where(table){
    width:100%;
    border-collapse:collapse;
    background:#FFFFFF;
    border:1px solid #E2E8F0;
    border-radius:var(--sonsec-radius-md);
    overflow:hidden;
    box-shadow:var(--sonsec-shadow-sm);
}

:where(th, td){
    padding:14px 16px;
    border-bottom:1px solid #E2E8F0;
    text-align:left;
    vertical-align:top;
}

.sonsec-theme-version-badge{
    position:fixed;
    right:16px;
    bottom:16px;
    z-index:9999;
    display:grid;
    gap:10px;
    width:min(360px, calc(100% - 32px));
    max-height:min(72vh, 860px);
    overflow:auto;
    padding:12px 14px;
    border:1px solid rgba(15,23,42,.10);
    border-radius:16px;
    background:rgba(255,255,255,.96);
    box-shadow:var(--sonsec-shadow-md);
    color:#0F172A;
    font-size:.72rem;
    font-weight:800;
    letter-spacing:.04em;
    line-height:1.2;
    backdrop-filter:blur(8px);
}

.sonsec-theme-version-badge__header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    text-transform:uppercase;
}

.sonsec-theme-version-badge__meta{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:8px 12px;
    margin:0;
    font-size:.68rem;
    font-weight:700;
    letter-spacing:0;
    text-transform:none;
}

.sonsec-theme-version-badge__meta div{
    min-width:0;
}

.sonsec-theme-version-badge__meta dt{
    color:#64748B;
    font-size:.62rem;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.04em;
}

.sonsec-theme-version-badge__meta dd{
    margin:2px 0 0;
    color:#0F172A;
    font-size:.68rem;
    font-weight:800;
    word-break:break-word;
}

.sonsec-theme-version-badge__status{
    margin:0;
    color:#475569;
    font-size:.68rem;
    line-height:1.35;
    text-transform:none;
    letter-spacing:0;
}

.sonsec-theme-version-badge__issues{
    display:grid;
    gap:6px;
    padding-left:16px;
    margin:0;
    color:#991B1B;
    font-size:.68rem;
    line-height:1.45;
}

.sonsec-theme-version-badge__issues li{
    margin:0;
}

.sonsec-theme-version-badge__status a{
    color:#0057B8;
    text-decoration:none;
}

.sonsec-theme-version-badge__status a:hover,
.sonsec-theme-version-badge__status a:focus-visible{
    color:#3333FF;
    text-decoration:underline;
}

.sonsec-theme-version-badge__version{
    color:#0057B8;
    font-weight:900;
}

.sonsec-theme-version-badge__list{
    display:grid;
    gap:6px;
    padding:0;
    margin:0;
    list-style:none;
    text-transform:none;
    letter-spacing:0;
}

.sonsec-theme-version-badge__list a{
    color:#0057B8;
    text-decoration:none;
}

.sonsec-theme-version-badge__list a:hover,
.sonsec-theme-version-badge__list a:focus-visible{
    color:#3333FF;
    text-decoration:underline;
}

.sonsec-theme-version-badge__host{
    margin:0;
    color:#475569;
    font-size:.7rem;
    line-height:1.4;
    text-transform:none;
    letter-spacing:0;
}

@media (max-width:699px){
    .sonsec-theme-version-badge{
        right:12px;
        bottom:12px;
        width:min(300px, calc(100% - 24px));
        max-height:min(60vh, 720px);
        padding:10px 12px;
        font-size:.68rem;
    }

    .sonsec-theme-version-badge__meta{
        grid-template-columns:1fr;
    }
}

@media (prefers-reduced-motion:reduce){
    .sonsec-theme-version-badge{
        backdrop-filter:none;
    }
}
