/* Kohthai Social Login — brand icon buttons under the WooCommerce forms.
   Sizing/shape come from CSS variables set by the plugin (see class-kt-sl-ui.php). */

.kt-sl{margin:18px 0 4px;clear:both;}
.kt-sl-align-center{text-align:center;}
.kt-sl-align-left{text-align:left;}
.kt-sl-align-right{text-align:right;}

/* "Or login with" — a centred caption with a hairline rule either side */
.kt-sl-title{display:flex;align-items:center;gap:12px;margin:0 0 14px;color:#a08565;font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;line-height:1;}
.kt-sl-title:before,.kt-sl-title:after{content:"";flex:1;height:1px;background:#e6ded5;}
.kt-sl-align-left .kt-sl-title:before,.kt-sl-align-right .kt-sl-title:after{display:none;}

.kt-sl-buttons{display:flex;flex-wrap:wrap;gap:12px;}
.kt-sl-align-center .kt-sl-buttons{justify-content:center;}
.kt-sl-align-right .kt-sl-buttons{justify-content:flex-end;}

.kt-sl-btn{
    display:inline-flex;align-items:center;justify-content:center;
    width:var(--kt-sl-size,44px);height:var(--kt-sl-size,44px);
    border-radius:var(--kt-sl-radius,50%);
    box-sizing:border-box;padding:0;border:1px solid transparent;
    text-decoration:none !important;line-height:1;cursor:pointer;
    box-shadow:0 1px 3px rgba(15,23,42,.12);
    transition:transform .15s ease,box-shadow .15s ease,filter .15s ease;
}
.kt-sl-btn:hover,.kt-sl-btn:focus{transform:translateY(-2px);box-shadow:0 6px 14px rgba(15,23,42,.18);text-decoration:none !important;}
.kt-sl-btn:focus-visible{outline:2px solid #654321;outline-offset:3px;}
.kt-sl-btn:active{transform:translateY(0);}

/* Google keeps its white plate (Google brand rules); Facebook uses brand blue. */
.kt-sl-google{background:#fff;border-color:#dadce0;}
.kt-sl-google:hover{background:#f8f9fa;}
.kt-sl-facebook{background:#1877F2;}
.kt-sl-facebook:hover{filter:brightness(1.07);}

.kt-sl-ico{width:55%;height:55%;display:block;}

/* Wide "Continue with ..." variant */
.kt-sl-labelled .kt-sl-buttons{flex-direction:column;gap:10px;}
.kt-sl-labelled .kt-sl-btn{
    width:100%;max-width:340px;height:auto;min-height:46px;
    padding:11px 16px;gap:10px;border-radius:10px;
    font-size:14.5px;font-weight:700;
}
.kt-sl-align-center.kt-sl-labelled .kt-sl-buttons{align-items:center;}
.kt-sl-labelled .kt-sl-ico{width:20px;height:20px;flex:none;}
.kt-sl-labelled .kt-sl-google .kt-sl-btn-text{color:#3c4043;}
.kt-sl-labelled .kt-sl-facebook .kt-sl-btn-text{color:#fff;}

.kt-sl-error{margin-bottom:16px;}

@media (max-width:480px){
    .kt-sl-title{font-size:11.5px;gap:9px;}
    .kt-sl-buttons{gap:10px;}
}