/* ==========================================================
   ESBS PREMIUM THEME
   Egyptian Society of Breast Surgery
   ========================================================== */

:root{

    --esbs-navy:#0B2D5C;
    --esbs-navy-dark:#071F41;

    --esbs-gold:#B8860B;
    --esbs-gold-light:#E4C36D;

    --esbs-text:#263648;
    --esbs-muted:#6B7785;

    --esbs-page:#F5F7FA;

    --esbs-border:#E3E8EE;

    --esbs-radius:16px;
}


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

html,
body{

    background:var(--esbs-page)!important;

    color:var(--esbs-text)!important;

    font-family:
        "IBM Plex Sans",
        Arial,
        sans-serif!important;
}

#main-col{

    max-width:1100px!important;

    margin:0 auto!important;
}


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

#survey-nav{

    background:#ffffff!important;

    min-height:150px!important;

    border-bottom:
        1px solid rgba(184,134,11,.15);

    box-shadow:
        0 2px 12px rgba(11,45,92,.05);
}

.esbs-navbar-inner{
    display:flex;
    justify-content:center;
    align-items:center;
    position:relative;
}

#navbar-menu{
    position:absolute;
    right:0;
    top:50%;
    transform:translateY(-50%);
}

.esbs-brand{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:20px;
}

.esbs-brand-text{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
}

.esbs-brand-ar{
    color:#b8860b;
    font-size:2rem;
    font-weight:700;
    line-height:1.1;
    text-align:center;
    margin-bottom:4px;
}

.esbs-brand-en{
    color:#002d72;
    font-size:1.15rem;
    font-weight:600;
    line-height:1.2;
    text-align:center;
}

.esbs-logo img{

    max-width:115px!important;

    max-height:115px!important;

    width:auto!important;

    height:auto!important;
}

.esbs-brand-text{

    display:flex;

    flex-direction:column;
}

.esbs-brand-ar{

    font-size:38px;

    font-weight:700;

    line-height:1.1;

    color:var(--esbs-gold);
}

.esbs-brand-en{

    font-size:18px;

    font-weight:700;

    line-height:1.2;

    color:var(--esbs-navy);
}

#navbar-menu{

    position:absolute;

    right:20px;
}

#navbar-toggler{

    background:transparent!important;

    border:none!important;

    color:var(--esbs-navy)!important;

    box-shadow:none!important;
}


/* ==========================================================
   PROGRESS BAR
   ========================================================== */

.progress{

    height:5px!important;

    border-radius:999px!important;

    background:#E4EAF1!important;
}

.progress-bar{

    background:
        linear-gradient(
            90deg,
            var(--esbs-navy),
            var(--esbs-gold)
        )!important;
}


/* ==========================================================
   TITLES
   ========================================================== */

.survey-name h1,
.group-title,
.group-name{

    color:var(--esbs-navy)!important;

    font-size:22px!important;

    font-weight:700!important;

    line-height:1.2!important;
}

.survey-name::after,
.group-title::after,
.group-name::after{

    display:none!important;
}


/* ==========================================================
   QUESTION CARDS
   ========================================================== */

.question-container{

    background:#ffffff!important;

    border:
        1px solid var(--esbs-border)!important;

    border-radius:
        var(--esbs-radius)!important;

    box-shadow:
        0 2px 8px rgba(11,45,92,.04)!important;

    margin-bottom:18px!important;
}

.question-title-container{

    padding:20px 24px 8px!important;
}

.answer-container{

    padding:10px 24px 20px!important;
}

.question-text{

    color:var(--esbs-navy)!important;

    font-size:17px!important;

    font-weight:700!important;
}

.question-help,
.ls-questionhelp,
.ls-questionhelp-before{

    color:var(--esbs-muted)!important;
}


/* ==========================================================
   REQUIRED
   ========================================================== */

.asterisk{

    color:var(--esbs-gold)!important;
}


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

.form-control,
input[type="text"],
input[type="email"],
input[type="number"],
input[type="tel"],
textarea,
select{

    border-radius:12px!important;

    border:
        1px solid #CFD7E0!important;

    min-height:48px!important;

    box-shadow:none!important;
}

textarea{

    min-height:120px!important;
}

.form-control:focus,
textarea:focus,
input:focus,
select:focus{

    border-color:
        var(--esbs-gold)!important;

    box-shadow:
        0 0 0 3px rgba(184,134,11,.15)!important;

    outline:none!important;
}


/* ==========================================================
   RADIOS / CHECKBOXES
   ========================================================== */

input[type="radio"],
input[type="checkbox"]{

    accent-color:var(--esbs-gold)!important;
}

/* Selected radio/checkbox labels */

.radio-item input:checked + label,
.checkbox-item input:checked + label{

    color:var(--esbs-navy)!important;

    font-weight:700!important;
}


/* ==========================================================
   REMOVE GREEN
   ========================================================== */

.text-success,
.success,
.alert-success,
.text-info{

    color:var(--esbs-navy)!important;
}

/* Language selector */

.languagechanger a,
.dropdown-item{

    color:var(--esbs-navy)!important;
}

/* Privacy links */

.privacy a,
#datasecurity_notice a{

    color:var(--esbs-navy)!important;
}

.privacy a:hover,
#datasecurity_notice a:hover{

    color:var(--esbs-gold)!important;
}

/* Common tick/check icons */

.fa-check,
.glyphicon-check,
.glyphicon-ok,
.ri-check-line,
.ri-checkbox-circle-fill{

    color:var(--esbs-gold)!important;
}


/* ==========================================================
   PRIVACY PANEL
   ========================================================== */

.privacy,
.privacy-container,
#datasecurity_notice{

    background:#FFFDF7!important;

    border-left:
        4px solid var(--esbs-gold)!important;

    border-radius:
        12px!important;

    padding:16px!important;
}


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

.btn-primary,
input[type="submit"]{

    background:
        var(--esbs-navy)!important;

    border-color:
        var(--esbs-navy)!important;

    color:#ffffff!important;

    border-radius:12px!important;

    min-height:52px!important;

    font-weight:700!important;
}

.btn-primary:hover,
.btn-primary:focus{

    background:
        var(--esbs-gold)!important;

    border-color:
        var(--esbs-gold)!important;
}


/* ==========================================================
   YES / NO QUESTIONS
   ========================================================== */

/* Selected state */

.btn-check:checked + .btn{

    background:#FFF8E7!important;

    color:var(--esbs-navy)!important;

    border:
        3px solid var(--esbs-gold)!important;

    box-shadow:
        0 0 0 4px rgba(184,134,11,.20)!important;

    font-weight:700!important;
}

/* Unselected state */

.btn-check + .btn{

    background:#ffffff!important;

    color:var(--esbs-navy)!important;

    border:
        2px solid #D9E1E8!important;
}


/* ==========================================================
   FOOTER
   ========================================================== */

.esbs-survey-footer{

    background:
        linear-gradient(
            135deg,
            var(--esbs-navy-dark),
            var(--esbs-navy)
        );

    border-top:
        2px solid var(--esbs-gold);

    text-align:center!important;

    color:#ffffff!important;

    padding:12px 16px;
}

.esbs-survey-footer-inner{

    max-width:700px;

    margin:0 auto;

    text-align:center;
}

.esbs-footer-accent,
.esbs-footer-platform{

    display:none!important;
}

.esbs-survey-footer-title{

    font-size:13px;

    font-weight:700;
}

.esbs-footer-programme{

    margin-top:4px;

    font-size:10px;

    color:var(--esbs-gold-light);

    letter-spacing:.05em;

    text-transform:uppercase;
}

.esbs-footer-contact{

    margin-top:4px;
}

.esbs-footer-contact a{

    color:#ffffff!important;

    text-decoration:none!important;

    font-size:11px;
}


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

@media (max-width:767px){

    #survey-nav{

        min-height:105px!important;
    }

    .esbs-navbar-inner{

        min-height:105px;

        padding:0 12px;
    }

    .esbs-logo img{

        max-width:80px!important;

        max-height:80px!important;
    }

    .esbs-brand-ar{

        font-size:18px!important;
    }

    .esbs-brand-en{

        font-size:12px!important;
    }

    .group-title,
    .group-name,
    .survey-name h1{

        font-size:20px!important;
    }

    .question-text{

        font-size:15px!important;
    }

    .btn-primary,
    input[type="submit"]{

        width:100%;
    }
}