/* GiDM Login & Register v2 */

/* === POPUP === */
.gl-popup{position:fixed;inset:0;z-index:999999;display:flex;align-items:center;justify-content:center}
.gl-popup.gl-popup-slider{justify-content:flex-end}
.gl-popup.gl-popup-slider .gl-modal{border-radius:0;height:100vh;max-height:100vh}
.gl-overlay{position:absolute;inset:0;background:var(--gl-overlay,#000);opacity:var(--gl-overlay-op,.7)}
.gl-modal{position:relative;display:flex;max-width:var(--gl-popup-w,800px);width:95%;max-height:90vh;background:var(--gl-popup-bg,#fff);border-radius:8px;overflow:hidden;box-shadow:0 25px 50px rgba(0,0,0,.25);animation:gl-fadeIn .3s ease}
@keyframes gl-fadeIn{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}
.gl-close{position:absolute;top:10px;right:14px;background:none;border:none;font-size:24px;cursor:pointer;color:var(--gl-popup-text,#1f2937);opacity:.5;z-index:2;line-height:1}
.gl-close:hover{opacity:1}

/* Sidebar */
.gl-sidebar{width:var(--gl-sidebar-w,40%);min-width:200px;overflow:hidden;position:relative}
.gl-sidebar img{width:100%;height:100%;object-fit:cover}
.gl-sidebar-right{order:2}

/* Content */
.gl-content,.gl-inline{flex:1;padding:30px 30px;overflow-y:auto;color:var(--gl-popup-text,#1f2937)}
.gl-inline{max-width:600px;margin:0 auto}

/* === TABS === */
.gl-tabs{display:flex;margin-bottom:24px;border-radius:4px;overflow:hidden;background:var(--gl-tab-bg,#e5e7eb)}
.gl-tab{flex:1;padding:var(--gl-tab-pad,12px 20px);border:none;background:transparent;cursor:pointer;font-size:var(--gl-tab-fs,16px);font-weight:600;color:var(--gl-tab-text,#1f2937);text-align:center;transition:all .2s}
.gl-tab.active{background:var(--gl-tab-active-bg,#000);color:var(--gl-tab-active-text,#fff)}

/* === NOTICE === */
.gl-notice{padding:10px 14px;border-radius:4px;font-size:13px;margin-bottom:16px}
.gl-notice.gl-error{background:#fef2f2;color:#dc2626;border:1px solid #fecaca}
.gl-notice.gl-success{background:#f0fdf4;color:#16a34a;border:1px solid #bbf7d0}

/* === FORM FIELDS === */
.gl-form{display:flex;flex-direction:column;gap:0}
.gl-field{margin-bottom:var(--gl-field-margin,30px)}
.gl-field-check{margin-bottom:var(--gl-field-margin,30px)}
.gl-field-row{display:flex;gap:12px}
.gl-cols-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.gl-label{display:block;font-size:13px;font-weight:500;margin-bottom:4px}

.gl-input-wrap{display:flex;align-items:stretch;border:var(--gl-input-bw,1px) solid var(--gl-input-bc,#e5e7eb);border-radius:4px;overflow:hidden;height:var(--gl-field-h,50px);background:var(--gl-input-bg,#f9fafb);position:relative}
.gl-input-wrap input,.gl-input-wrap select,.gl-input-wrap textarea{flex:1;border:none;padding:0 12px;font-size:14px;background:transparent;color:var(--gl-input-text,#6b7280);outline:none;height:100%}
.gl-input-wrap input:focus,.gl-input-wrap select:focus{background:var(--gl-input-focus-bg,#fff);color:var(--gl-input-focus-text,#1f2937)}
.gl-input-wrap input::placeholder{color:var(--gl-input-text,#6b7280)}

/* Icon */
.gl-icon{display:flex;align-items:center;justify-content:center;width:var(--gl-icon-cw,40px);min-width:var(--gl-icon-cw,40px);background:var(--gl-icon-bg,#f3f4f6);border-right:var(--gl-icon-bw,1px) solid var(--gl-icon-bc,#e5e7eb);font-size:var(--gl-icon-size,14px);color:var(--gl-icon-color,#4b5563)}

/* Password toggle */
.gl-pw-toggle{display:flex;align-items:center;justify-content:center;width:40px;cursor:pointer;color:var(--gl-icon-color,#4b5563);font-size:14px}
.gl-pw-toggle:hover{color:var(--gl-popup-text,#1f2937)}

/* Required */
.gl-req{color:#dc2626;margin-left:4px;font-size:13px;position:absolute;top:50%;right:8px;transform:translateY(-50%)}

/* Checkbox */
.gl-check-label{display:flex;align-items:center;gap:6px;font-size:13px;cursor:pointer}
.gl-check-label input{width:auto;margin:0}
.gl-check-label a{color:inherit;font-weight:600;text-decoration:underline}

/* Row between */
.gl-row-between{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;font-size:13px}

/* Link */
.gl-link{color:var(--gl-popup-text,#1f2937);cursor:pointer;font-size:13px;text-decoration:none;font-weight:500}
.gl-link:hover{text-decoration:underline}
.gl-desc{font-size:13px;color:#6b7280;margin:0 0 16px}

/* Button */
.gl-btn{width:100%;padding:0;height:var(--gl-btn-h,40px);background:var(--gl-btn-bg,#000);color:var(--gl-btn-text,#fff);border:var(--gl-btn-border,2px solid #000);border-radius:0;font-size:14px;font-weight:700;cursor:pointer;text-transform:uppercase;letter-spacing:1px;transition:opacity .2s;position:relative}
.gl-btn:hover{opacity:.85}
.gl-btn:disabled{opacity:.5;cursor:not-allowed}
.gl-spinner{display:inline-block;width:14px;height:14px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:gl-spin .6s linear infinite;margin-right:6px;vertical-align:middle}
@keyframes gl-spin{to{transform:rotate(360deg)}}

/* Checkout */
.gl-checkout-login{margin-bottom:20px}
.gl-checkout-msg{font-size:14px}

/* Mobile */
@media(max-width:640px){
    .gl-modal{flex-direction:column}
    .gl-sidebar{width:100%;min-width:unset;max-height:120px}
    .gl-content,.gl-inline{padding:20px}
    .gl-cols-2{grid-template-columns:1fr}
}