/* ========================================================================
   SUTA Mobile Layout v2.0
   HEADER
   ======================================================================== */

@media screen and (max-width:768px){

:root{

    --mobile-header-height:72px;

    --mobile-bg:#13212B;

    --mobile-orange:#FF5F00;

    --mobile-padding:16px;

}

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

/* Login/member cell: flexible width (do NOT lock to 120px) */
#id_4D83xQe{
    flex:1 1 auto !important;
    width:auto !important;
    min-width:72px !important;
    max-width:55% !important;
}

#id_5O2wtHT .loginLink{
    font-size:16px !important;
    white-space:nowrap !important;
}

#idHeaderContentHolder{

    position:sticky;

    top:0;

    z-index:9990;

}

#id_tKRbtOi{

    display:flex !important;

    align-items:center !important;

    justify-content:space-between !important;

    height:var(--mobile-header-height);

    background:var(--mobile-bg);

    border-bottom:2px solid var(--mobile-orange);

    padding:0 var(--mobile-padding);

}

/* =========================================================
   TABLE FIX
========================================================= */

#id_tKRbtOi table,
#id_tKRbtOi tbody,
#id_tKRbtOi tr{

    display:flex !important;

    width:100%;

    height:100%;

    align-items:center;

}

#id_tKRbtOi td{

    display:flex !important;

    align-items:center !important;

    padding:0;

}

#id_rHySEkJ{

    justify-content:flex-start !important;

}

#id_7Y8LhKo{

    display:none !important;

}

#id_hMbDPSv{

    display:none !important;

}

#id_4D83xQe{

    margin-left:auto !important;

    justify-content:flex-end !important;

}

#id_rHySEkJ a{
    display:flex !important;
    align-items:center;
}

#id_rHySEkJ img{
    margin-right:10px;
}

/* =========================================================
   REMOVE FIXED WIDTHS
========================================================= */

#id_rHySEkJ,
#id_7Y8LhKo,
#id_hMbDPSv,
#id_4D83xQe{

    width:auto !important;

}

/* =========================================================
   LOGO — compact so member name has room
========================================================= */

#id_rHySEkJ{

    flex:0 0 auto !important;

    width:auto !important;

    min-width:0 !important;

    max-width:140px !important;

}

#id_rHySEkJ img{

    width:48px !important;

    height:48px !important;

    object-fit:contain;

    display:block;

    flex-shrink:0;

}

#id_rHySEkJ span{

    white-space:nowrap;

    overflow:hidden;

    text-overflow:ellipsis;

}

/* On very narrow phones, keep logo mark only — frees space for member name */
@media screen and (max-width:400px){

#id_rHySEkJ span{
    display:none !important;
}

#id_rHySEkJ{
    max-width:56px !important;
}

}

/* =========================================================
   HIDE SEARCH + TOP MENU
========================================================= */

#id_hMbDPSv{

    display:none !important;

}

#id_9rvu2tV{

    display:none !important;

}

/* WildApricot blue hamburger */

#id_9rvu2tV .toggleButton{

    display:none !important;

}

/* =========================================================
   LOGIN (base; final rules at bottom of file)
========================================================= */

}

/* =========================================================
   MOBILE MENU BUTTON
========================================================= */

@media screen and (max-width:768px){

#suta-mobile-button{

    width:44px;

    height:44px;

    margin-left:8px;

    padding:0;

    border:none;

    background:none;

    cursor:pointer;

    display:flex;

    align-items:center;

    justify-content:center;

    flex-shrink:0;

}

#suta-mobile-button span{

    position:relative;

    display:block;

    width:24px;

    height:2px;

    background:var(--mobile-orange);

    transition:.3s;

}

#suta-mobile-button span::before,
#suta-mobile-button span::after{

    content:"";

    position:absolute;

    left:0;

    width:24px;

    height:2px;

    background:var(--mobile-orange);

    transition:.3s;

}

#suta-mobile-button span::before{

    top:-7px;

}

#suta-mobile-button span::after{

    top:7px;

}

/* OPEN */

body.suta-mobile-open #suta-mobile-button span{

    background:transparent;

}

body.suta-mobile-open #suta-mobile-button span::before{

    top:0;

    transform:rotate(45deg);

}

body.suta-mobile-open #suta-mobile-button span::after{

    top:0;

    transform:rotate(-45deg);

}

}

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

@media screen and (min-width:769px) and (max-width:1024px){

#id_4D83xQe{
    display:flex !important;
}

/* Hide WA mobile toggle */

#id_9rvu2tV .toggleButton{

    display:none !important;

}

/* Search */

#id_hMbDPSv{

    margin-right:18px !important;

}

/* Login */

#id_4D83xQe{

    margin-left:18px !important;

}

/* Hamburger */

#suta-mobile-button{

    display:none !important;

}

}

/* =========================================================
   DESKTOP
========================================================= */

@media screen and (min-width:1025px){

#id_4D83xQe{
    display:flex !important;
}

#suta-mobile-button{

    display:none !important;

}

}

/* =========================================================
   CLEANUP
========================================================= */



/* Focus */

#id_5O2wtHT .loginLink:focus{

    outline:none;

}

/* Prevent image rules from old CSS */

#id_4D83xQe img{

    width:auto !important;

    height:auto !important;

    filter:none !important;

}



/* ===========================
   Desktop Login
=========================== */





/* Login - all devices */




@media (max-width:1024px){

    #id_9rvu2tV,
    #id_9rvu2tV *,
    .WaGadgetMenuHorizontal,
    .WaGadgetMenuHorizontal *,
    .menuInner{
        display:none !important;
    }

    #id_hMbDPSv{
        display:none !important;
    }

    #suta-mobile-button{
        display:flex !important;
    }

}

/* ===========================
   FIX LOGIN LAYOUT (MOBILE)
=========================== */

@media screen and (max-width:768px){

/* Header row: table shares space with hamburger (do not force 100% width) */
#id_tKRbtOi > table{
    flex:1 1 auto !important;
    width:auto !important;
    min-width:0 !important;
    max-width:calc(100% - 52px) !important;
}

#id_tKRbtOi table,
#id_tKRbtOi tbody,
#id_tKRbtOi tr{
    min-width:0 !important;
}

/* Keep WA inner text on one line */
#id_5O2wtHT .loginLink span{
    display:inline !important;
    white-space:nowrap !important;
    line-height:1 !important;
    vertical-align:middle !important;
}

#id_5O2wtHT .loginLink br{
    display:none !important;
}

/* Login / member name cell — visible, right side, can use free space */
#id_4D83xQe{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;

    flex:1 1 auto !important;
    width:auto !important;
    min-width:72px !important;   /* never collapse to 0 */
    max-width:55% !important;

    height:auto !important;
    margin-left:auto !important;
    margin-right:0 !important;
    margin-top:0 !important;
    margin-bottom:0 !important;
    padding:0 4px 0 0 !important;
    overflow:visible !important;
}

#id_5O2wtHT,
#id_5O2wtHT .loginContainer,
#id_5O2wtHT .loginContainerInner{
    display:block !important;
    width:auto !important;
    max-width:100% !important;
    min-width:0 !important;
    height:auto !important;
    margin:0 !important;
    padding:0 !important;
    line-height:1 !important;
    overflow:hidden !important;
}

/* Icon + text; long names get ellipsis, short names show fully */
#id_5O2wtHT .loginLink{
    position:relative !important;
    display:block !important;
    box-sizing:border-box !important;

    font-size:15px !important;
    font-weight:700 !important;
    color:#FF5F00 !important;
    line-height:1.2 !important;
    white-space:nowrap !important;
    text-align:left !important;
    direction:ltr !important;
    vertical-align:middle !important;

    width:auto !important;
    max-width:100% !important;
    height:auto !important;
    margin:0 !important;
    padding:0 0 0 24px !important;

    overflow:hidden !important;
    text-overflow:ellipsis !important;

    background-color:transparent !important;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23FF5F00'%3E%3Cpath d='M12 12a5 5 0 1 0 0-10 5 5 0 0 0 0 10zm0 2c-4.42 0-8 2.24-8 5v1h16v-1c0-2.76-3.58-5-8-5z'/%3E%3C/svg%3E") !important;
    background-repeat:no-repeat !important;
    background-position:left center !important;
    background-size:16px 16px !important;
}

/* Kill WA absolute icon pseudos that sit on top of the text */
#id_5O2wtHT .loginLink::before,
#id_5O2wtHT .loginLink::after{
    content:none !important;
    display:none !important;
    background:none !important;
    width:0 !important;
    height:0 !important;
    margin:0 !important;
    padding:0 !important;
    position:static !important;
}

#id_5O2wtHT .loginLink:hover,
#id_5O2wtHT .loginLink.hover{
    color:#B9B9B9 !important;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23B9B9B9'%3E%3Cpath d='M12 12a5 5 0 1 0 0-10 5 5 0 0 0 0 10zm0 2c-4.42 0-8 2.24-8 5v1h16v-1c0-2.76-3.58-5-8-5z'/%3E%3C/svg%3E") !important;
}

}