/* ============================================================
   LINKWORLD EXPRESS
   PREMIUM COOKIE CONSENT SYSTEM
   CSS MATCHED TO cookies.html
============================================================ */


/* ============================================================
   COOKIE VARIABLES
============================================================ */

:root {

    --lw-cookie-navy: #0D1A2B;
    --lw-cookie-navy-light: #14263D;

    --lw-cookie-orange: #FF5A1F;
    --lw-cookie-orange-dark: #C8410C;

    --lw-cookie-white: #ffffff;

    --lw-cookie-text: #10161F;
    --lw-cookie-muted: #57626C;

    --lw-cookie-border: #CDD1C3;

    --lw-cookie-soft: #F2F3EC;

    --lw-cookie-shadow:
        0 25px 70px rgba(0, 0, 0, 0.20);

    --lw-cookie-display: 'Big Shoulders Stencil Text', sans-serif;
    --lw-cookie-body: 'IBM Plex Sans', sans-serif;
    --lw-cookie-mono: 'IBM Plex Mono', monospace;

}

.lw-cookie-banner,
.lw-cookie-banner input,
.lw-cookie-banner button {
    font-family: var(--lw-cookie-body);
}

.lw-cookie-heading h2 {
    font-family: var(--lw-cookie-display);
    font-weight: 700;
    letter-spacing: .01em;
}

.lw-cookie-label {
    font-family: var(--lw-cookie-mono);
    letter-spacing: .12em;
}

.lw-cookie-option-info h3 {
    font-family: var(--lw-cookie-display);
    font-weight: 700;
}


/* ============================================================
   COOKIE CONTAINER
============================================================ */

.lw-cookie-banner {

    position: fixed;

    left: 28px;
    bottom: 28px;

    width: min(760px, calc(100% - 56px));

    z-index: 999999;

    background:
        rgba(255, 255, 255, 0.97);

    border:
        1px solid rgba(255, 255, 255, 0.85);

    border-radius: 20px;

    box-shadow:
        var(--lw-cookie-shadow);

    backdrop-filter:
        blur(20px);

    -webkit-backdrop-filter:
        blur(20px);

    overflow: hidden;

    color:
        var(--lw-cookie-text);

    animation:
        lwCookieAppear
        0.55s
        cubic-bezier(.2, .8, .2, 1)
        forwards;

}


/* ============================================================
   APPEAR ANIMATION
============================================================ */

@keyframes lwCookieAppear {

    0% {

        opacity: 0;

        transform:
            translateY(35px);

    }

    100% {

        opacity: 1;

        transform:
            translateY(0);

    }

}


/* ============================================================
   MAIN INNER LAYOUT
============================================================ */

.lw-cookie-inner {

    display: flex;

    align-items: flex-start;

    gap: 18px;

    padding: 25px;

}


/* ============================================================
   PRIVACY ICON
============================================================ */

.lw-cookie-icon {

    width: 50px;
    height: 50px;

    min-width: 50px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 15px;

    background:
        linear-gradient(
            135deg,
            var(--lw-cookie-navy),
            var(--lw-cookie-navy-light)
        );

    color:
        #ffffff;

    box-shadow:
        0 8px 22px
        rgba(7, 26, 43, 0.20);

}


/* SVG inside icon */

.lw-cookie-icon svg {

    display: block;

    width: 22px;
    height: 22px;

}


/* ============================================================
   COOKIE CONTENT
============================================================ */

.lw-cookie-content {

    flex: 1;

    min-width: 0;

}


/* ============================================================
   HEADING
============================================================ */

.lw-cookie-heading {

    margin: 0;

    padding: 0;

}


/* ============================================================
   BRAND LABEL
============================================================ */

.lw-cookie-label {

    display: block;

    margin-bottom: 4px;

    color:
        var(--lw-cookie-orange);

    font-size: 10px;

    line-height: 1.2;

    font-weight: 800;

    letter-spacing: 1.6px;

    text-transform: uppercase;

}


/* ============================================================
   MAIN TITLE
============================================================ */

.lw-cookie-heading h2 {

    margin: 0;

    padding: 0;

    color:
        var(--lw-cookie-navy);

    font-size: 20px;

    line-height: 1.25;

    font-weight: 800;

    letter-spacing: -0.3px;

}


/* ============================================================
   DESCRIPTION
============================================================ */

.lw-cookie-description {

    margin:
        12px 0 13px;

    padding: 0;

    color:
        var(--lw-cookie-muted);

    font-size: 13px;

    line-height: 1.65;

}


/* ============================================================
   PRIVACY LINKS
============================================================ */

.lw-cookie-links {

    display: flex;

    align-items: center;

    flex-wrap: wrap;

    gap: 10px;

    margin:
        0 0 19px;

}


.lw-cookie-links a {

    display: inline-block;

    color:
        var(--lw-cookie-navy);

    font-size: 11px;

    line-height: 1.4;

    font-weight: 750;

    text-decoration: none;

    transition:
        color 0.2s ease;

}


.lw-cookie-links a:hover {

    color:
        var(--lw-cookie-orange);

}


.lw-cookie-links span {

    color:
        #b7c0c7;

    font-size: 11px;

}


/* ============================================================
   COOKIE PREFERENCES PANEL
============================================================ */

.lw-cookie-preferences {

    margin:
        5px 0 20px;

    padding:
        15px 0 0;

    border-top:
        1px solid var(--lw-cookie-border);

}


.lw-cookie-preferences[hidden] {

    display: none !important;

}


/* ============================================================
   COOKIE OPTION ROW
============================================================ */

.lw-cookie-option {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;

    padding:
        13px 0;

    border-bottom:
        1px solid #edf0f2;

}


.lw-cookie-option:last-of-type {

    border-bottom:
        none;

}


/* ============================================================
   COOKIE OPTION INFORMATION
============================================================ */

.lw-cookie-option-info {

    flex: 1;

    min-width: 0;

}


.lw-cookie-option-info h3 {

    margin:
        0 0 4px;

    padding: 0;

    color:
        var(--lw-cookie-navy);

    font-size: 12px;

    line-height: 1.3;

    font-weight: 800;

}


.lw-cookie-option-info p {

    margin: 0;

    padding: 0;

    color:
        var(--lw-cookie-muted);

    font-size: 10px;

    line-height: 1.55;

}


/* ============================================================
   TOGGLE CONTAINER
============================================================ */

.lw-toggle {

    position: relative;

    display: block;

    width: 45px;
    height: 25px;

    min-width: 45px;

}


/* ============================================================
   HIDE REAL CHECKBOX
============================================================ */

.lw-toggle input {

    position: absolute;

    width: 1px;
    height: 1px;

    opacity: 0;

    pointer-events: none;

}


/* ============================================================
   TOGGLE BACKGROUND
============================================================ */

.lw-toggle-slider {

    position: absolute;

    inset: 0;

    display: block;

    background:
        #cbd3d9;

    border-radius: 30px;

    cursor: pointer;

    transition:
        background 0.25s ease;

}


/* ============================================================
   TOGGLE CIRCLE
============================================================ */

.lw-toggle-slider::before {

    content: "";

    position: absolute;

    width: 19px;
    height: 19px;

    top: 3px;
    left: 3px;

    background:
        #ffffff;

    border-radius: 50%;

    box-shadow:
        0 2px 5px
        rgba(0, 0, 0, 0.18);

    transition:
        transform 0.25s ease;

}


/* ============================================================
   TOGGLE ACTIVE
============================================================ */

.lw-toggle input:checked
+ .lw-toggle-slider {

    background:
        var(--lw-cookie-orange);

}


.lw-toggle input:checked
+ .lw-toggle-slider::before {

    transform:
        translateX(20px);

}


/* ============================================================
   DISABLED ESSENTIAL TOGGLE
============================================================ */

.lw-toggle input:disabled
+ .lw-toggle-slider {

    opacity:
        0.78;

    cursor:
        not-allowed;

}


/* ============================================================
   SAVE PREFERENCES ROW
============================================================ */

.lw-cookie-save-row {

    display: flex;

    justify-content: flex-end;

    align-items: center;

    padding-top:
        15px;

}


/* ============================================================
   MAIN ACTION BUTTON AREA
============================================================ */

.lw-cookie-actions {

    display: flex;

    align-items: center;

    justify-content: flex-end;

    gap: 9px;

    flex-wrap: wrap;

}


/* ============================================================
   ALL COOKIE BUTTONS
============================================================ */

.lw-cookie-button {

    min-height: 43px;

    padding:
        0 17px;

    border:
        1px solid transparent;

    border-radius: 9px;

    font-family:
        inherit;

    font-size: 12px;

    line-height: 1;

    font-weight: 750;

    letter-spacing: 0;

    cursor: pointer;

    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease,
        background 0.2s ease,
        border-color 0.2s ease,
        color 0.2s ease;

}


.lw-cookie-button:hover {

    transform:
        translateY(-1px);

}


.lw-cookie-button:active {

    transform:
        translateY(0);

}


/* ============================================================
   MANAGE PREFERENCES
============================================================ */

.lw-cookie-manage {

    background:
        transparent;

    border-color:
        var(--lw-cookie-border);

    color:
        var(--lw-cookie-navy);

}


.lw-cookie-manage:hover {

    background:
        #f7f9fa;

    border-color:
        #d7dfe4;

}


/* ============================================================
   ESSENTIAL ONLY
============================================================ */

.lw-cookie-essential {

    background:
        #eef2f5;

    border-color:
        #eef2f5;

    color:
        var(--lw-cookie-navy);

}


.lw-cookie-essential:hover {

    background:
        #e4e9ed;

    border-color:
        #e4e9ed;

}


/* ============================================================
   ACCEPT ALL
============================================================ */

.lw-cookie-accept {

    background:
        linear-gradient(
            135deg,
            var(--lw-cookie-orange),
            var(--lw-cookie-orange-dark)
        );

    border-color:
        var(--lw-cookie-orange);

    color:
        #ffffff;

    box-shadow:
        0 7px 18px
        rgba(244, 123, 32, 0.24);

}


.lw-cookie-accept:hover {

    box-shadow:
        0 10px 25px
        rgba(244, 123, 32, 0.34);

}


/* ============================================================
   SAVE PREFERENCES BUTTON
============================================================ */

.lw-cookie-save {

    min-width:
        150px;

    background:
        linear-gradient(
            135deg,
            var(--lw-cookie-orange),
            var(--lw-cookie-orange-dark)
        );

    border-color:
        var(--lw-cookie-orange);

    color:
        #ffffff;

    box-shadow:
        0 6px 16px
        rgba(244, 123, 32, 0.20);

}


.lw-cookie-save:hover {

    box-shadow:
        0 9px 22px
        rgba(244, 123, 32, 0.30);

}


/* ============================================================
   KEYBOARD ACCESSIBILITY
============================================================ */

.lw-cookie-button:focus-visible {

    outline:
        3px solid
        rgba(244, 123, 32, 0.35);

    outline-offset:
        3px;

}


.lw-cookie-links a:focus-visible {

    outline:
        3px solid
        rgba(244, 123, 32, 0.35);

    outline-offset:
        3px;

    border-radius:
        3px;

}


.lw-toggle input:focus-visible
+ .lw-toggle-slider {

    outline:
        3px solid
        rgba(244, 123, 32, 0.35);

    outline-offset:
        3px;

}


/* ============================================================
   CLOSING ANIMATION
============================================================ */

.lw-cookie-banner.lw-cookie-closing {

    opacity:
        0;

    transform:
        translateY(30px);

    transition:
        opacity 0.3s ease,
        transform 0.3s ease;

}


/* ============================================================
   TABLET
============================================================ */

@media (max-width: 800px) {

    .lw-cookie-banner {

        left:
            18px;

        bottom:
            18px;

        width:
            calc(100% - 36px);

    }


    .lw-cookie-inner {

        padding:
            22px;

    }

}


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

@media (max-width: 600px) {

    .lw-cookie-banner {

        left:
            10px;

        right:
            10px;

        bottom:
            10px;

        width:
            auto;

        border-radius:
            16px;

    }


    .lw-cookie-inner {

        display:
            block;

        padding:
            19px;

    }


    /* ---------------------------------------------------------
       Icon
    --------------------------------------------------------- */

    .lw-cookie-icon {

        width:
            42px;

        height:
            42px;

        min-width:
            42px;

        margin-bottom:
            12px;

        border-radius:
            12px;

    }


    .lw-cookie-icon svg {

        width:
            19px;

        height:
            19px;

    }


    /* ---------------------------------------------------------
       Heading
    --------------------------------------------------------- */

    .lw-cookie-label {

        font-size:
            9px;

    }


    .lw-cookie-heading h2 {

        font-size:
            17px;

    }


    /* ---------------------------------------------------------
       Description
    --------------------------------------------------------- */

    .lw-cookie-description {

        margin-top:
            10px;

        font-size:
            12px;

        line-height:
            1.6;

    }


    /* ---------------------------------------------------------
       Links
    --------------------------------------------------------- */

    .lw-cookie-links {

        margin-bottom:
            16px;

    }


    /* ---------------------------------------------------------
       Preferences
    --------------------------------------------------------- */

    .lw-cookie-option {

        gap:
            12px;

    }


    .lw-cookie-option-info h3 {

        font-size:
            11px;

    }


    .lw-cookie-option-info p {

        font-size:
            9.5px;

    }


    /* ---------------------------------------------------------
       Save Button
    --------------------------------------------------------- */

    .lw-cookie-save-row {

        justify-content:
            stretch;

    }


    .lw-cookie-save {

        width:
            100%;

    }


    /* ---------------------------------------------------------
       Main Buttons
    --------------------------------------------------------- */

    .lw-cookie-actions {

        display:
            grid;

        grid-template-columns:
            1fr 1fr;

        gap:
            8px;

        width:
            100%;

    }


    .lw-cookie-button {

        width:
            100%;

        min-height:
            42px;

        padding:
            0 10px;

        font-size:
            11px;

    }


    .lw-cookie-accept {

        grid-column:
            1 / -1;

        order:
            -1;

    }


    .lw-cookie-manage {

        grid-column:
            1 / 2;

    }


    .lw-cookie-essential {

        grid-column:
            2 / 3;

    }

}


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

@media (max-width: 380px) {

    .lw-cookie-inner {

        padding:
            16px;

    }


    .lw-cookie-heading h2 {

        font-size:
            16px;

    }


    .lw-cookie-description {

        font-size:
            11px;

    }


    .lw-cookie-button {

        font-size:
            10px;

    }

}


/* ============================================================
   REDUCED MOTION
============================================================ */

@media (prefers-reduced-motion: reduce) {

    .lw-cookie-banner {

        animation:
            none;

    }


    .lw-cookie-button,
    .lw-toggle-slider,
    .lw-toggle-slider::before,
    .lw-cookie-links a {

        transition:
            none;

    }

}


/* ============================================================
   PRINT
   The banner is site chrome, not document content - never let
   it show up in a printed page or exported PDF.
============================================================ */

@media print {

    .lw-cookie-banner {

        display:none !important;

    }

}