/* EK Mindset Dark - Frontend CSS
   - Styles the inline (non-fixed) circular button and provides default light/dark styles
   - Dynamic color overrides are added via wp_add_inline_style() from PHP based on admin settings
*/

.ek-dark-toggle-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:44px;
    height:44px;
    border-radius:50%;
    border:0;
    cursor:pointer;
    background:#ffffff;
    box-shadow:0 6px 12px rgba(16,24,40,0.08);
    transition: background .22s ease, box-shadow .22s ease, transform .12s ease;
    padding:0;
}
.ek-dark-toggle-btn:active{ transform: scale(.98); }
.ek-dark-toggle-btn .ek-icon{ display:inline-flex; align-items:center; justify-content:center; }
.ek-dark-toggle-btn .ek-icon-moon{ display:none; }

/* When dark mode active, change button background & icon visibility */
.ek-dark-active .ek-dark-toggle-btn{
    background:#1f2937; /* dark background */
    box-shadow:0 6px 18px rgba(2,6,23,0.4);
}
.ek-dark-active .ek-dark-toggle-btn .ek-icon-sun{ display:none; }
.ek-dark-active .ek-dark-toggle-btn .ek-icon-moon{ display:inline-flex; }

/* Icon sizes */
.ek-dark-toggle-btn svg{ width:18px; height:18px; }

/* Accessible focus */
.ek-dark-toggle-btn:focus{ outline:3px solid rgba(59,130,246,0.28); outline-offset:3px; }

/* End of file */