/*
Theme Name: UCA VicTas Church Theme
Theme URI: https://www.victas.uca.org.au
Version: 1.0
Description: A custom theme created for UCA VicTas churches & congregations.
Author: Guna Krishnamoorthy
Author URI: https://www.victas.uca.org.au
template: bb-theme
*/

/* ==========================================
   Typography - Desktop First (WCAG Friendly)
   ========================================== */

body {
    font-family: "Source Sans 3", Arial, sans-serif;
    font-size: 17px;
    line-height: 1.7;
    color: #1F1F1F;
}

h1 {
    font-family: "Source Sans 3", Arial, sans-serif;
    font-size: 48px;
    line-height: 1.2;
}

h2 {
    font-family: "Source Sans 3", Arial, sans-serif;
    font-size: 36px;
    line-height: 1.25;
}

h3 {
    font-family: "Source Sans 3", Arial, sans-serif;
    font-size: 30px;
    line-height: 1.3;
}

h4 {
    font-family: "Source Sans 3", Arial, sans-serif;
    font-size: 24px;
    line-height: 1.35;
}

h5 {
    font-family: "Source Sans 3", Arial, sans-serif;
    font-size: 20px;
    line-height: 1.4;
}

h6 {
    font-family: "Source Sans 3", Arial, sans-serif;
    font-size: 18px;
    line-height: 1.5;
}

/* ==========================
   Tablet (≤ 992px)
   ========================== */

@media (max-width: 992px) {

    body {
        font-size: 17px;
    }

    h1 { font-size: 40px; }
    h2 { font-size: 32px; }
    h3 { font-size: 28px; }
    h4 { font-size: 22px; }
    h5 { font-size: 19px; }
    h6 { font-size: 18px; }

}

/* ==========================
   Mobile (≤ 768px)
   ========================== */

@media (max-width: 768px) {

    body {
        font-size: 16px;
    }

    h1 { font-size: 36px; }
    h2 { font-size: 30px; }
    h3 { font-size: 24px; }
    h4 { font-size: 22px; }
    h5 { font-size: 20px; }
    h6 { font-size: 18px; }

}

p {margin: 10px 0 20px 0;}
h1, h2, h3 {margin: 15px 0 25px 0;}
h4, h5, h6 {margin: 10px 0 20px 0;}


/* ==========================================
   Logo
   ========================================== */

.uca-logo{
    max-width:400px !important;
    margin:0 auto;
    text-align:center;
}


/* ==========================================
   Sticky Navigation
   ========================================== */

.fl-page-header-fixed .fl-page-nav-wrap .navbar-nav>li>a{
    padding:12px 14px;
}

/* ==========================================
   Mobile Menu
   ========================================== */
@media (max-width:767px){

    /* Mobile Menu Container */
    .fl-menu{
        background:#353535;
    }

    /* Hamburger Toggle */
    .fl-menu-mobile-toggle{
        color:#ffffff !important;
        min-width:48px;
        min-height:48px;
    }

    .fl-menu-mobile-toggle:hover,
    .fl-menu-mobile-toggle:focus-visible,
    .fl-menu-mobile-toggle.fl-active{
        color:#ffffff !important;
        outline:3px solid #005FCC;
        outline-offset:2px;
    }

    /* Top Level Menu */
    .fl-menu .menu > li{
        border-bottom:1px solid rgba(255,255,255,.15);
    }

    .fl-menu .menu > li > a{
        display:flex;
        align-items:center;
        min-height:48px;
        padding:14px 18px;
        font-size:18px;
        line-height:1.5;
        color:#ffffff !important;
        text-transform:none;
    }

    .fl-menu .menu > li > a:hover,
    .fl-menu .menu > li > a:focus-visible{
        background:#8B1E1E;
        color:#ffffff !important;
        text-decoration:underline;
        text-decoration-thickness:2px;
    }

    /* Sub Menu */
    .fl-menu .sub-menu{
        background:#202020;
        border-left:4px solid #8B1E1E;
    }

    .fl-menu .sub-menu > li > a{
        display:flex;
        align-items:center;
        min-height:48px;
        padding:12px 18px 12px 32px;
        font-size:17px;
        color:#ffffff !important;
    }

    .fl-menu .sub-menu > li > a:hover,
    .fl-menu .sub-menu > li > a:focus-visible{
        background:#8B1E1E;
        color:#ffffff !important;
    }

    /* Current Page */
    .current-menu-item > a{
        background:#8B1E1E;
        font-weight:700;
        color:#ffffff !important;
    }

    /* Submenu Arrow */
    .fl-menu .fl-toggle-arrows .fl-menu-toggle{
        width:48px;
        height:48px;
    }

    .fl-menu .fl-toggle-arrows .fl-menu-toggle::before{
        border-color:#ffffff !important;
    }

}


/* ==========================================
   Keyboard Focus (WCAG 2.2)
   ========================================== */

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
.fl-button:focus-visible{

    outline:3px solid #005FCC;
    outline-offset:3px;
    border-radius:4px;

}

a:focus-visible{

    background:#005FCC;
    color:#ffffff !important;

}


/* ==========================================
   Events Calendar
   ========================================== */

.tribe-events-button,
.tribe-events-calendar td.tribe-events-present div[id*="tribe-events-daynum-"]{
    background:#8B1E1E;
}

.events-list .tribe-events-loop{
    max-width:1200px;
    margin:0 auto;
}

.tribe-events-schedule h2{
    font-size:22px;
    font-weight:600;
}

.single-tribe_events .tribe-events-single-event-title{
    font-size:42px;
    line-height:1.2;
}


/* ==========================================
   Contact
   ========================================== */

.uca-synod-office{
    max-width:600px;
}


/* ==========================================
   Text Selection
   ========================================== */

::selection{
    background:#8B1E1E;
    color:#ffffff;
}

::-moz-selection{
    background:#8B1E1E;
    color:#ffffff;
}


/* ==========================================
   Footer
   ========================================== */

.uc-footer{
    font-size:16px;
    line-height:1.8;
    color:#ffffff;
}

.uc-footer a{
    color:#ffffff !important;
    text-decoration:underline;
    text-underline-offset:3px;
}

.uc-footer a:hover{
    color:#8B1E1E !important;
}

.uc-upper-footer a{
    color:#ffffff !important;
    text-decoration:none;
}

.uc-upper-footer a:hover{
    color:#C58B00  !important;
}

.uabb-post-wrapper .uabb-post-heading{
    margin:0;
    padding:0 0 10px;
    border-bottom:1px solid #000;
}


/* ==========================================
   404 Search
   ========================================== */

.404-search{
    font-size:24px;
    color:#ffffff;
}

input[type="search"],
.404-search input{

    font-size:20px;
    color:#ffffff !important;
    padding:12px 16px;
    background:none;
    border:2px solid #ffffff;
    border-radius:6px;
    min-height:60px;

}

input[type="search"]:focus{

    border-color:#005FCC;
    outline:3px solid #005FCC;
    outline-offset:2px;

}
/* ==========================================
   Additional WCAG CSS
   ========================================== */
*,
*::before,
*::after{
    box-sizing:border-box;
}

a{
    
    text-underline-offset:3px;
}

a:hover{
    text-decoration-thickness:2px;
}

.fl-post-content a,
.entry-content a{

    text-decoration:underline;
    text-underline-offset:3px;

}

.fl-page-nav a,
.fl-button,
.button{

    text-decoration:none;

}

input,
textarea,
select{
    font-family:"Source Sans 3", Arial, sans-serif;
    font-size:18px;
    line-height:1.5;
}

button,
input[type="submit"],
.fl-button{

    min-height:44px;
    min-width:44px;

}

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

table{

    width:100%;
    border-collapse:collapse;

}

th,
td{

    padding:12px;
    text-align:left;

}

th{

    font-weight:700;

}

iframe,
embed,
object,
video{

    max-width:100%;

}

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

    *,
    *::before,
    *::after{

        animation:none !important;
        transition:none !important;
        scroll-behavior:auto !important;

    }

}


/* Space between stacked Beaver Builder columns on mobile */
@media (max-width:768px){

    .fl-col-group > .fl-col:not(:last-child){
        margin-bottom:24px;
    }

}
