/* تنسيقات البطاقة لتقليد شكل مواقع الأدوات الاحترافية */
.tool-card {
    transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
    border-radius: 10px; /* زوايا مستديرة */
    border: 1px solid #dee2e6 !important; /* حدود خفيفة */
    position: relative; /* ضروري لعمل stretched-link */
    min-height: 200px; /* لضمان شكل موحد للبطاقات */
}

/* تأثير عند المرور بالماوس (Hover) */
.tool-card:hover {
    transform: translateY(-5px); /* رفع البطاقة قليلاً */
    box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.1) !important; /* ظل أكبر وأكثر وضوحًا */
    cursor: pointer;
}

/* لضمان أن النص والايقونة داخل البطاقة لا يتأثروا بالـ stretched-link */
.tool-card > * {
    position: relative;
    z-index: 2; 
}

/* ======================================= */
/* تنسيقات صفحات المصادقة (Login/Register) */
/* ======================================= */

/* ضبط خلفية الجسم للون الفاتح النظيف لمشروع إتقان */
body.bg-light-subtle {
    background-color: #f8f9fa !important;
}

/* 1. الحاوية الرئيسية لتوسيط النموذج في منتصف الشاشة */
.auth-container {
    /* حساب الارتفاع المتبقي من الشاشة بعد الـ Header */
    min-height: calc(100vh - 100px); 
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px 0;
}

/* 2. صندوق النموذج (بطاقة التسجيل/الدخول) */
.auth-box {
    max-width: 400px; 
    width: 100%;
    background-color: #ffffff; /* الخلفية البيضاء */
    padding: 30px;
    border-radius: 8px;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.1); /* ظل خفيف */
}

/* 3. تنسيق عنوان النموذج */
.auth-box h2 {
    font-weight: 700;
    color: #333; /* الكتابة السوداء */
    margin-bottom: 25px;
    text-align: center;
}

/* 4. تنسيق حقول الإدخال */
.auth-form .input-group {
    margin-bottom: 15px;
    position: relative;
}

.auth-form .input-group input {
    /* جعل حقل الإدخال يبدأ من اليمين (لغة عربية) */
    text-align: right; 
    border-radius: 6px;
    height: 48px;
    /* زيادة البادنج من اليسار لإفساح المجال للأيقونة */
    padding-left: 40px !important; 
}

/* 5. تنسيق الأيقونة داخل حقل الإدخال */
.auth-form .input-group i {
    position: absolute;
    left: 15px; /* وضع الأيقونة على اليسار */
    top: 50%;
    transform: translateY(-50%);
    font-size: 18px;
    color: #999;
    pointer-events: none; /* لمنع الأيقونة من تعطيل النقر على الحقل */
}

/* 6. تنسيق روابط التبديل (نسيت كلمة المرور / لديك حساب) */
.login-link a, .register-link a {
    color: #dc3545; /* اللون الأحمر (danger) لمشروع إتقان */
    font-weight: 600;
    text-decoration: none;
}

/* ======================================= */
/* FIX: فرض التباعد المتساوي لروابط الفوتر (للتوثيق فقط - يتم فرضه في translator.php) */
/* ======================================= */
/* ترك هذه القواعد هنا لنظافة التوثيق, لكنها ليست حاسمة بعد تطبيقها في translator.php */
footer .row ul li {
    margin-bottom: 8px; 
    padding: 0; 
    line-height: 1.2; 
}

footer .row ul li a {
    display: block; 
}
/* ======================================= */
/* تنسيق خاص لأزرار التخزين السحابي في أدوات PDF */
/* ======================================= */

/* لجعل الأيقونات الدائرية بنفس حجم الأيقونات في الصورة */
.btn-outline-secondary.rounded-circle {
    width: 45px;
    height: 45px;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* تعديل لون أيقونات Google Drive و Dropbox لتقليد الصورة المرفقة */
.fa-google-drive {
    color: #db4437 !important; /* لون أحمر Drive */
}

.fa-dropbox {
    color: #0070e0 !important; /* لون أزرق Dropbox */
}

/* ===== تجاوب عام (2026) — منع تمرير أفقي + شعار/أزرار عائمة على الجوال */
html {
  overflow-x: clip;
  max-width: 100%;
}
@media (max-width: 576px) {
  .logo-text { font-size: 1rem !important; }
}
@media (max-width: 991.98px) {
  .float-action-wrapper {
    left: auto !important;
    right: max(10px, env(safe-area-inset-right, 0px)) !important;
    bottom: calc(18px + env(safe-area-inset-bottom, 0px)) !important;
    z-index: 1020;
  }
}