@charset "UTF-8";

@import url('https://fonts.googleapis.com/css?family=Roboto&display=swap');
@import url('https://fonts.googleapis.com/css?family=Oswald&display=swap');

/* =========================================================
   COOKIEBOT – WORKCRED STYLES (SCOPED + CLEAN)
   Load AFTER your main custom.css
   ========================================================= */

/* -------------------------
   A) BIG COOKIEBOT DIALOG
   ------------------------- */

/* Card feel */
#CybotCookiebotDialog {
    border-radius: 18px !important;
    box-shadow: 0 22px 70px rgba(0,0,0,.30) !important;
    border: 1px solid rgba(255,255,255,.22) !important;
    overflow: hidden !important;
}

    /* Remove Cookiebot injected "TEST" overlay */
    #CybotCookiebotDialog > div[style*="font-size: 100px"],
    #CybotCookiebotDialog > div[style*="font-size:100px"] {
        display: none !important;
    }

/* Hide Cookiebot branding in big dialog */
#CybotCookiebotDialogPoweredbyCybot,
#CybotCookiebotDialogPoweredbyText,
#CybotCookiebotDialogPoweredbyLink a,
#CybotCookiebotDialogPoweredbyLink svg {
    display: none !important;
    visibility: hidden !important;
}

/* ---- Fix Workcred logo sizing (NO squish, NO stretch) ----
   Key idea:
   - give wrapper room
   - remove clamping
   - set width + height:auto (never fixed height)
*/
/*#CybotCookiebotDialogHeaderLogosWrapper,
#CybotCookiebotDialogPoweredbyLink {
    display: flex !important;
    align-items: center !important;
    overflow: visible !important;
    height: auto !important;
    max-height: none !important;
    min-height: 72px !important;*/ /* room for logo */
/*}

#CybotCookiebotDialogPoweredbyImage {
    width: 260px !important;*/ /* desktop */
    /*height: auto !important;
    max-width: 100% !important;
    max-height: none !important;
    object-fit: contain !important;
    display: block !important;
}*/

/* Mobile: slightly smaller */
/*@media (max-width: 768px) {
    #CybotCookiebotDialogHeaderLogosWrapper,
    #CybotCookiebotDialogPoweredbyLink {
        min-height: 60px !important;
    }

    #CybotCookiebotDialogPoweredbyImage {
        width: 200px !important;
    }
}*/
/* Kill any forced size on logo wrappers */
#CybotCookiebotDialogHeader #CybotCookiebotDialogHeaderLogosWrapper,
#CybotCookiebotDialogHeader #CybotCookiebotDialogPoweredbyLink {
    width: auto !important;
    height: auto !important;
    max-height: none !important;
    min-height: 72px !important;
    overflow: visible !important;
    display: flex !important;
    align-items: center !important;
}

/* Force the image itself */
#CybotCookiebotDialogHeader #CybotCookiebotDialogPoweredbyImage {
    width: 276px !important; /* your real size */
    height: auto !important;
    max-width: none !important; /* important: don't let it shrink */
    object-fit: contain !important;
    display: block !important;
}

/* Sometimes Cookiebot sets inline width/height attrs; neutralize */
#CybotCookiebotDialogHeader img#CybotCookiebotDialogPoweredbyImage {
    width: 276px !important;
    height: auto !important;
}
@media (max-width: 768px) {
    #CybotCookiebotDialogHeader #CybotCookiebotDialogPoweredbyImage {
        width: 200px !important;
        max-width: none !important;
    }
}
#CybotCookiebotDialogHeaderLogosWrapper,
#CybotCookiebotDialogPoweredbyLink,
#CybotCookiebotDialogPoweredbyImage {
    transform: none !important;
}



/* ---- Top pills: center + spacing ---- */
#CybotCookiebotDialogNav {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 18px !important;
    padding-top: 14px !important;
    margin-top: 8px !important;
}

    #CybotCookiebotDialogNav ul,
    #CybotCookiebotDialogNav .CybotCookiebotDialogNavItems {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        gap: 18px !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Pills typography (Oswald only here — not global) */
    #CybotCookiebotDialogNav a,
    #CybotCookiebotDialogNav button,
    #CybotCookiebotDialogNav a span,
    #CybotCookiebotDialogNav button span {
        font-family: "Oswald", Arial, sans-serif !important;
        font-weight: 400 !important;
        letter-spacing: .04em !important;
        text-transform: uppercase !important;
        border-radius: 999px !important;
        padding: 8px 18px !important;
        border: 1px solid rgba(17,24,39,.16) !important;
        background: #fff !important;
        color: #6b7280 !important;
    }

        /* Selected pill */
        #CybotCookiebotDialogNav a.CybotCookiebotDialogNavItemSelected,
        #CybotCookiebotDialogNav a[aria-selected="true"],
        #CybotCookiebotDialogNav button[aria-selected="true"] {
            color: #111827 !important;
            border-color: rgba(0,117,191,.35) !important;
            box-shadow: 0 8px 18px rgba(0,117,191,.18) !important;
        }

/* Headings / titles inside dialog */
#CybotCookiebotDialog h1,
#CybotCookiebotDialog h2,
#CybotCookiebotDialog h3,
#CybotCookiebotDialog h4,
#CybotCookiebotDialogBodyContentTitle,
.CybotCookiebotDialogDetailBodyContentTitle,
.CybotCookiebotDialogDetailBodyContentCookieContainerTypeHeader {
    font-family: "Oswald", Arial, sans-serif !important;
    font-weight: 400 !important;
    letter-spacing: .03em !important;
    text-transform: uppercase !important;
}

/* Buttons inside dialog */
#CybotCookiebotDialog button,
#CybotCookiebotDialog a.CybotCookiebotDialogBodyButton,
#CybotCookiebotDialogFooter button,
#CybotCookiebotDialogFooter a {
    font-family: "Oswald", Arial, sans-serif !important;
    font-weight: 400 !important;
    letter-spacing: .04em !important;
    text-transform: uppercase !important;
}

/* Desktop compactness */
@media (min-width: 992px) {
    #CybotCookiebotDialog {
        max-height: 82vh !important;
    }

    #CybotCookiebotDialogBody {
        max-height: 56vh !important;
        overflow: auto !important;
    }

    #CybotCookiebotDialogHeader {
        padding-top: 14px !important;
        padding-bottom: 6px !important;
    }

    #CybotCookiebotDialogFooter {
        padding-top: 12px !important;
        padding-bottom: 14px !important;
    }
}

/* -------------------------
   B) SMALL COOKIEBOT WIDGET
   ------------------------- */

/* Hide Cookiebot branding in widget */
.CookiebotWidget-main-logo,
.CookiebotWidget-poweredby,
.CookiebotWidget-footer .CookiebotWidget-poweredby,
.CookiebotWidget-footer a[href*="cookiebot"],
.CookiebotWidget-footer a[href*="usercentrics"],
#CookiebotWidget .CookiebotWidget-poweredby {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
}

/* IMPORTANT:
   Do NOT do `.CookiebotWidget * { font-family: Oswald !important; }`
   That’s too broad and causes weird side effects in some builds.
   Instead: apply Oswald only to widget title + buttons.
*/

/* Widget title / header */
.CookiebotWidget .CookiebotWidget-header,
.CookiebotWidget .CookiebotWidget-title,
.CookiebotWidget h1,
.CookiebotWidget h2,
#CookiebotWidget .CookiebotWidget-header,
#CookiebotWidget .CookiebotWidget-title {
    font-family: "Oswald", Arial, sans-serif !important;
    font-weight: 400 !important;
    letter-spacing: .03em !important;
    text-transform: uppercase !important;
}

/* Widget buttons */
.CookiebotWidget button,
.CookiebotWidget .CookiebotWidget-button,
.CookiebotWidget a[role="button"],
#CookiebotWidget button,
#CookiebotWidget .CookiebotWidget-button,
#CookiebotWidget a[role="button"] {
    font-family: "Oswald", Arial, sans-serif !important;
    font-weight: 400 !important;
    letter-spacing: .04em !important;
    text-transform: uppercase !important;
}
/* =========================================================
   COOKIEBOT – FIX SQUISHED WORKCRED LOGO (max-height:1.5em override)
   ========================================================= */

#CybotCookiebotDialogHeaderLogosWrapper,
#CybotCookiebotDialogPoweredbyLink {
  display: flex !important;
  align-items: center !important;
  height: auto !important;
  min-height: 56px !important;      /* give the header room */
  overflow: visible !important;
}

/* The logo image itself */
#CybotCookiebotDialogPoweredbyImage {
  max-height: none !important;      /* <-- THIS is the key */
  height: auto !important;
  width: clamp(180px, 26vw, 260px) !important;
  max-width: 100% !important;
  object-fit: contain !important;
  display: block !important;
}

/* Extra safety if Cookiebot targets it with higher specificity */
#CybotCookiebotDialogHeader #CybotCookiebotDialogPoweredbyImage {
  max-height: none !important;
  height: auto !important;
}
/* HARD-disable Cookiebot IMG logo */
#CybotCookiebotDialogPoweredbyImage {
    visibility: hidden !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
    max-height: 0 !important;
    overflow: hidden !important;
}

/* =========================================================
   COOKIEBOT – SINGLE Workcred logo (background-based)
   ========================================================= */

#CybotCookiebotDialogPoweredbyLink {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    height: 72px !important;
}

    /* the actual logo */
    #CybotCookiebotDialogPoweredbyLink::before {
        content: "" !important;
        display: block !important;
        width: 276px !important;
        height: 71px !important;
        background: url("/images/simple-logo1.png") no-repeat left center !important;
        background-size: contain !important;
    }


    /*////////////          keep my old my css for cookie, 
        if we need to return it           ///////////*/

    /*.CookiebotWidget-main-logo {
    display: none !important;
    visibility: hidden !important;
}

#CybotCookiebotDialogPoweredbyCybot {
    display: none !important;
    visibility: hidden !important;
}

#CybotCookiebotDialogPoweredbyText {
    display: none !important;
    visibility: hidden !important;
}

    #CybotCookiebotDialogPoweredByText a {
        color: #ffffff !important;
    }

#CybotCookiebotDialogDetailFooter {
    display: none !important;
    visibility: hidden !important;
}

.CookiebotWidget-header {
    background-color: #0075bf !important;
    color: white !important;
}

#CybotCookiebotDialogHeader {
    background-color: #0075bf !important;
}

#CybotCookiebotDialogPoweredbyImage {
    content: url('/images/simple-logo1.png') !important;
}

.CookiebotWidget-body {
    background-color: #efefef !important;
}

.CybotCookiebotDialogNavItems {
    background-color: #ffffff !important;
}

#CybotCookiebotDialogFooter {
    background-color: #ffffff !important;
}*/
    /* End GDPR*/