/* ═══════════════════════════════════════════════
   Shaheen Security — Legal pages shared stylesheet
   (Terms / Privacy / SLA)
   ═══════════════════════════════════════════════ */

* { box-sizing: border-box; }

html, body { margin: 0; padding: 0; }

body.legal {
    font-family: 'Tajawal', 'Inter', sans-serif;
    color: #1e293b;
    background: #f8fafc;
    line-height: 1.85;
    font-size: 15px;
}

.container {
    max-width: 880px;
    margin: 0 auto;
    padding: 0 20px;
}

/* ── Header ── */
.legal-header {
    background: linear-gradient(135deg, #1e3a5f 0%, #2563eb 100%);
    color: #fff;
    padding: 24px 0 32px;
    margin-bottom: 32px;
}
.legal-header .back-home {
    color: #bfdbfe;
    text-decoration: none;
    font-size: 13px;
    display: inline-block;
    margin-bottom: 18px;
    transition: color 0.15s;
}
.legal-header .back-home:hover { color: #fff; }
.legal-title h1 {
    margin: 0 0 6px;
    font-size: 30px;
    font-weight: 800;
    letter-spacing: -0.02em;
}
.legal-title .legal-meta {
    margin: 0;
    font-size: 13px;
    color: #bfdbfe;
}

/* ── Body ── */
.legal-body {
    padding: 0 20px 60px;
}
.legal-body section {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 22px 26px;
    margin-bottom: 18px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.03);
}
.legal-body h2 {
    margin: 0 0 14px;
    font-size: 19px;
    font-weight: 700;
    color: #1e3a5f;
    border-inline-start: 4px solid #2563eb;
    padding-inline-start: 10px;
}
.legal-body h3 {
    font-size: 16px;
    color: #1e3a5f;
    margin: 18px 0 8px;
    font-weight: 600;
}
.legal-body p {
    margin: 8px 0;
}
.legal-body a {
    color: #2563eb;
    text-decoration: none;
    border-bottom: 1px solid #bfdbfe;
    transition: border-color 0.15s;
}
.legal-body a:hover {
    border-bottom-color: #2563eb;
}
.legal-body ul, .legal-body ol {
    margin: 8px 0;
    padding-inline-start: 24px;
}
.legal-body li {
    margin: 5px 0;
}
.legal-body li > ul,
.legal-body li > ol {
    margin-top: 4px;
    margin-bottom: 4px;
}
.legal-body strong {
    color: #1e3a5f;
}
.legal-body code {
    background: #f1f5f9;
    color: #1e40af;
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 13px;
    font-family: 'SFMono-Regular', Menlo, Consolas, monospace;
    direction: ltr;
    display: inline-block;
}

/* ── Tables (used in SLA) ── */
.legal-body table {
    width: 100%;
    border-collapse: collapse;
    margin: 14px 0;
    font-size: 14px;
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
}
.legal-body thead {
    background: #1e3a5f;
    color: #fff;
}
.legal-body th,
.legal-body td {
    padding: 10px 14px;
    border: 1px solid #e2e8f0;
    text-align: start;
    vertical-align: top;
}
.legal-body th {
    font-weight: 600;
    font-size: 13px;
}
.legal-body tbody tr:nth-child(even) {
    background: #f8fafc;
}

/* ── Footer (inside body) ── */
.legal-footer {
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 18px 22px;
    margin-top: 26px;
    font-size: 13px;
    color: #64748b;
    text-align: center;
}
.legal-footer p { margin: 4px 0; }
.legal-footer em {
    color: #475569;
    font-style: normal;
}
.legal-footer a {
    color: #2563eb;
    text-decoration: none;
    margin: 0 6px;
}
.legal-footer a:hover {
    text-decoration: underline;
}

/* ── Mobile ── */
@media (max-width: 640px) {
    .legal-title h1 { font-size: 24px; }
    .legal-body section { padding: 16px 18px; }
    .legal-body h2 { font-size: 17px; }
    .legal-body th, .legal-body td { padding: 8px 10px; font-size: 13px; }
}