/* ═══════════════════════════════════════════════════════════
   عقارات نت — Auth Pages Stylesheet
   Covers: login.php | register.php | forgot-password.php
   Palette: Deep Navy #1B4F72 + Gold #C9A84C + Ivory #F4F1EB
   ═══════════════════════════════════════════════════════════ */

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px}

:root{
    --primary:       #1B4F72;
    --primary-light: #2E86AB;
    --primary-dark:  #0D2D45;
    --accent:        #C9A84C;
    --accent-light:  #E8C97A;
    --accent-dark:   #A07A28;
    --success:       #27AE60;
    --danger:        #E74C3C;
    --warning:       #F39C12;
    --bg:            #F4F1EB;
    --bg-warm:       #FDF9F3;
    --text-dark:     #1A252F;
    --text-body:     #3D5166;
    --text-muted:    #8A9BB0;
    --border:        #E0D8CE;
    --gold-gradient: linear-gradient(135deg,#C9A84C,#E8C97A,#A07A28);
    --navy-gradient: linear-gradient(135deg,#0D2D45,#1B4F72,#2E86AB);
    --shadow-card:   0 22px 64px rgba(27,79,114,.13),0 6px 22px rgba(27,79,114,.08);
    --shadow-btn:    0 6px 22px rgba(27,79,114,.32);
    --shadow-gold:   0 6px 22px rgba(201,168,76,.35);
    --shadow-focus:  0 0 0 3px rgba(201,168,76,.2);
    --radius:        14px;
    --radius-sm:     10px;
    --radius-lg:     22px;
    --radius-full:   9999px;
    --font:          'Cairo',sans-serif;
    --tr:            .25s cubic-bezier(.4,0,.2,1);
}

body{
    font-family:var(--font);
    background:var(--bg);
    color:var(--text-body);
    direction:rtl;
    text-align:right;
    line-height:1.7;
    min-height:100vh;
    overflow-x:hidden;
}
a{text-decoration:none;color:inherit;transition:var(--tr)}
button,input,select,textarea{font-family:inherit}

/* ════ PAGE WRAPPER ════ */
.auth-page,
body.auth-page,
.auth-container{
    min-height:100vh;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:28px 16px;
    position:relative;
    background:var(--bg);
    background-image:
        radial-gradient(ellipse at 15% 15%, rgba(27,79,114,.07) 0%,transparent 55%),
        radial-gradient(ellipse at 85% 85%, rgba(201,168,76,.08) 0%,transparent 55%);
}

/* floating decoration blobs */
.auth-page::before,.auth-page::after{
    content:'';
    position:fixed;
    border-radius:50%;
    pointer-events:none;
    z-index:0;
}
.auth-page::before{
    width:500px;height:500px;
    top:-180px;right:-180px;
    background:radial-gradient(circle,rgba(27,79,114,.07) 0%,transparent 70%);
}
.auth-page::after{
    width:380px;height:380px;
    bottom:-120px;left:-120px;
    background:radial-gradient(circle,rgba(201,168,76,.08) 0%,transparent 70%);
}

/* ════ AUTH CARD ════ */
.auth-card{
    position:relative;z-index:1;
    width:100%;max-width:460px;
    background:#fff;
    border-radius:var(--radius-lg);
    box-shadow:var(--shadow-card);
    padding:40px 40px 34px;
    border:1px solid rgba(201,168,76,.18);
    animation:authIn .42s cubic-bezier(.34,1.5,.64,1) both;
}
/* gold accent bar on top */
.auth-card::before{
    content:'';
    position:absolute;
    top:0;right:0;left:0;
    height:4px;
    background:var(--gold-gradient);
    border-radius:var(--radius-lg) var(--radius-lg) 0 0;
}
@keyframes authIn{
    from{opacity:0;transform:translateY(32px) scale(.96)}
    to  {opacity:1;transform:none}
}

/* wider card for register */
.auth-card[style*="max-width:520px"],
.auth-card.wide{max-width:520px}

/* ════ LOGO ════ */
.auth-logo{
    text-align:center;
    margin-bottom:26px;
}
.auth-logo .logo-icon{
    width:64px;height:64px;
    background:var(--navy-gradient);
    border-radius:18px;
    display:inline-flex;align-items:center;justify-content:center;
    color:var(--accent-light);font-size:1.55rem;
    margin-bottom:11px;
    box-shadow:var(--shadow-btn);
    position:relative;overflow:hidden;
}
.auth-logo .logo-icon::after{
    content:'';position:absolute;inset:0;
    background:linear-gradient(135deg,transparent 40%,rgba(255,255,255,.11) 60%,transparent 70%);
}
.auth-logo .logo-main{
    display:block;
    font-size:1.5rem;font-weight:900;
    color:var(--primary);line-height:1.15;
    letter-spacing:-.3px;
}
.auth-logo .logo-sub{
    font-size:.73rem;color:var(--text-muted);font-weight:600;letter-spacing:.4px;
}
.auth-logo .logo-text{
    display:block;font-size:1.4rem;font-weight:900;color:var(--primary);
}

/* ════ HEADINGS ════ */
.auth-title,
.auth-header h1,
.auth-card h1{
    font-size:1.35rem;font-weight:900;
    color:var(--text-dark);
    margin-bottom:5px;
    text-align:center;line-height:1.3;
}
.auth-sub,
.auth-header p,
.auth-card>p{
    font-size:.88rem;color:var(--text-muted);
    text-align:center;margin-bottom:26px;line-height:1.65;
}
.auth-header{margin-bottom:22px;text-align:center}
.auth-header p{margin-bottom:0}

/* ════ FORM GROUPS ════ */
.form-group{
    margin-bottom:17px;
}
.form-label,
.form-group>label{
    display:flex;align-items:center;justify-content:space-between;
    font-size:.84rem;font-weight:700;
    color:var(--text-dark);margin-bottom:7px;
}
.form-label a,
.form-group>label a{
    font-size:.81rem;font-weight:600;
    color:var(--primary-light);
}
.form-label a:hover,
.form-group>label a:hover{color:var(--accent-dark)}

/* ════ INPUTS ════ */
.form-control{
    width:100%;
    padding:11px 14px;
    border:1.5px solid var(--border);
    border-radius:var(--radius-sm);
    font-size:.9rem;font-family:var(--font);
    color:var(--text-dark);
    background:var(--bg-warm);
    outline:none;
    transition:all var(--tr);
    -webkit-appearance:none;
}
.form-control:focus{
    border-color:var(--accent);
    box-shadow:var(--shadow-focus);
    background:#fff;
}
.form-control::placeholder{color:var(--text-muted);font-size:.85rem}

/* icon inside input */
.input-icon,[style*="position:relative"]{position:relative}
.input-icon>i:first-child,
[style*="position:relative"]>i[class*="fas"][style*="position:absolute"]{
    position:absolute !important;
    right:13px !important;top:50%;
    transform:translateY(-50%);
    color:var(--accent) !important;
    font-size:.88rem;
    pointer-events:none;z-index:1;
}
.input-icon .form-control{padding-right:40px}
.form-control[style*="padding-right:42px"]{padding-right:42px !important}
.form-control[style*="padding-left:42px"]{padding-left:42px !important}

/* toggle password */
.toggle-password,
[style*="position:absolute"][style*="left:14px"] button,
button[onclick*="togglePass"]{
    position:absolute;
    left:12px;top:50%;
    transform:translateY(-50%);
    background:none;border:none;
    color:var(--text-muted);font-size:.88rem;
    cursor:pointer;padding:4px;
    transition:color var(--tr);z-index:1;
}
.toggle-password:hover{color:var(--primary)}

/* ════ 2-COL GRID ════ */
.auth-card [style*="grid-template-columns:1fr 1fr"],
.auth-card [style*="grid-template-columns: 1fr 1fr"]{gap:14px !important}

/* ════ REMEMBER / AGREE ════ */
.auth-card input[type="checkbox"]{
    accent-color:var(--primary);cursor:pointer;
}
.auth-card [style*="display:flex"][style*="align-items:center"][style*="gap:8px"],
.auth-card [style*="display:flex"][style*="align-items:flex-start"]{
    gap:9px !important;
}

/* ════ SUBMIT BUTTON ════ */
.btn-submit,
button[type="submit"],
.btn.btn-primary.btn-block,
a.btn.btn-primary.btn-block{
    width:100%;
    padding:13px 20px;
    background:var(--navy-gradient);
    color:#fff;
    border:none;
    border-radius:var(--radius-sm);
    font-family:var(--font);
    font-size:.95rem;font-weight:800;
    cursor:pointer;
    display:flex;align-items:center;justify-content:center;gap:9px;
    box-shadow:var(--shadow-btn);
    transition:all var(--tr);
    position:relative;overflow:hidden;
    text-decoration:none;
    margin-top:2px;
}
.btn-submit::after,
.btn.btn-primary.btn-block::after{
    content:'';position:absolute;inset:0;
    background:linear-gradient(135deg,transparent 40%,rgba(255,255,255,.09) 60%,transparent 70%);
    opacity:0;transition:opacity .3s;
}
.btn-submit:hover,
.btn.btn-primary.btn-block:hover{
    transform:translateY(-2px);
    box-shadow:0 10px 30px rgba(27,79,114,.4);
}
.btn-submit:hover::after,
.btn.btn-primary.btn-block:hover::after{opacity:1}
.btn-submit:active{transform:translateY(0)}
.btn-submit i{font-size:.88rem}

/* ════ OUTLINE BUTTON ════ */
.btn-outline,
.btn.btn-outline.btn-block,
a.btn.btn-outline.btn-block{
    display:flex;align-items:center;justify-content:center;
    width:100%;padding:11px 20px;
    background:none;
    border:2px solid var(--border);
    border-radius:var(--radius-sm);
    color:var(--text-body);
    font-size:.88rem;font-weight:700;
    cursor:pointer;transition:all var(--tr);
    text-decoration:none;font-family:var(--font);
}
.btn-outline:hover,
.btn.btn-outline.btn-block:hover{
    border-color:var(--primary);
    color:var(--primary);background:rgba(27,79,114,.04);
}

/* ════ DIVIDER ════ */
.auth-divider,
[style*="text-align:center"][style*="position:relative"]{
    position:relative;text-align:center;
    margin:20px 0;color:var(--text-muted);font-size:.82rem;
}

/* ════ ALERTS ════ */
.alert,[style*="background:#fee2e2"],[style*="background:#d1fae5"]{
    padding:12px 15px;
    border-radius:var(--radius-sm);
    font-size:.87rem;
    display:flex;align-items:flex-start;gap:9px;
    margin-bottom:18px;line-height:1.55;
}
.alert-error,[style*="background:#fee2e2"]{
    background:rgba(231,76,60,.08) !important;
    border:1.5px solid rgba(231,76,60,.22) !important;
    color:var(--danger) !important;
}
.alert-success,[style*="background:#d1fae5"]{
    background:rgba(39,174,96,.08) !important;
    border:1.5px solid rgba(39,174,96,.22) !important;
    color:var(--success) !important;
}
.alert i{flex-shrink:0;margin-top:2px}

/* ════ FOOTER ════ */
.auth-footer,.auth-links{
    text-align:center;font-size:.86rem;
    color:var(--text-muted);margin-top:20px;
}
.auth-footer a,.auth-links a{
    color:var(--primary-light);font-weight:700;
    transition:color var(--tr);
    display:inline-flex;align-items:center;gap:5px;
}
.auth-footer a:hover,.auth-links a:hover{color:var(--primary);text-decoration:underline}

/* ════ SUCCESS / EMAIL ICONS ════ */
.success-icon,.email-icon{
    width:70px;height:70px;
    border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    font-size:1.8rem;margin:0 auto 16px;
}
.success-icon{
    background:rgba(39,174,96,.1);color:var(--success);
    border:2px solid rgba(39,174,96,.22);
}
.email-icon{
    background:rgba(27,79,114,.08);color:var(--primary-light);
    border:2px solid rgba(27,79,114,.15);
}

/* ════ PASSWORD STRENGTH ════ */
.password-strength,#strengthBar{
    height:5px;border-radius:3px;
    background:var(--border);margin-top:8px;overflow:hidden;
}
#passStrength>div{height:5px;border-radius:3px;background:var(--border);overflow:hidden;}
#passStrength #strengthBar{height:100%;transition:width .3s,background .3s;}

/* ════ BACK LINK ════ */
.auth-back{
    display:inline-flex;align-items:center;gap:7px;
    font-size:.84rem;color:var(--text-muted);
    transition:color var(--tr);margin-bottom:18px;
}
.auth-back:hover{color:var(--primary)}

/* ════ RESPONSIVE ════ */
@media(max-width:520px){
    .auth-card{padding:28px 20px 26px;border-radius:var(--radius)}
    .auth-card [style*="grid-template-columns:1fr 1fr"],
    .auth-card [style*="grid-template-columns: 1fr 1fr"]{
        grid-template-columns:1fr !important;
    }
    .auth-logo .logo-icon{width:56px;height:56px;font-size:1.35rem}
    .auth-logo .logo-main{font-size:1.3rem}
}
@media(max-width:370px){
    .auth-card{padding:22px 14px}
    .auth-title,.auth-header h1{font-size:1.15rem}
}