@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@400;500;700;900&display=swap');

/* =========================================================
   الزواج الميسر — تنسيق الواجهة الأمامية
   الألوان الأساسية: أزرق + أصفر، مع الأحمر بحدّ أدنى (تحذيرات/حظر فقط)
   ========================================================= */

:root{
	--blue-deep:#0B3D75;
	--blue:#1768B3;
	--blue-soft:#E8F1FB;
	--blue-line:#C9DEF2;

	--yellow:#F2B705;
	--yellow-deep:#B5840A;
	--yellow-soft:#FDF3D9;
	--yellow-line:#F0DDA0;

	--red:#C0392B;
	--red-soft:#F8E6E3;

	--ink:#16242E;
	--ink-soft:#55636F;
	--bg:#F7F9FC;
	--line:#E1E6ED;
	--white:#FFFFFF;
}

.zawaj-form, .zawaj-dashboard, .zawaj-public-profile, .zawaj-search-results,
.zawaj-calculator, .zawaj-compat-form, .badge-list, .chips, .grid, .mini-card,
.card, .zawaj-notice {
	direction: rtl;
	text-align: right;
	font-family: -apple-system, "Tajawal", "Segoe UI", Tahoma, sans-serif;
	color: var(--ink);
	box-sizing: border-box;
}
.zawaj-form *, .zawaj-dashboard *{ box-sizing: border-box; }

/* ---------------- تنبيهات ---------------- */
.zawaj-notice{
	padding:12px 16px; border-radius:10px; margin-bottom:16px; font-size:14px; font-weight:500;
}
.zawaj-notice-success{ background:var(--blue-soft); color:var(--blue-deep); border:1px solid var(--blue-line); }
.zawaj-notice-info{ background:var(--yellow-soft); color:var(--yellow-deep); border:1px solid var(--yellow-line); }
.zawaj-notice-error{ background:var(--red-soft); color:var(--red); border:1px solid #E8C3BC; }

/* ---------------- نماذج ---------------- */
.zawaj-form{ max-width:640px; }
.zawaj-field{ margin-bottom:16px; }
.zawaj-field label{ display:block; font-weight:700; font-size:13.5px; margin-bottom:6px; color:var(--blue-deep); }
.zawaj-field input[type="text"],
.zawaj-field input[type="email"],
.zawaj-field input[type="password"],
.zawaj-field input[type="number"],
.zawaj-field input[type="date"],
.zawaj-field input[type="file"],
.zawaj-field select,
.zawaj-field textarea,
.zawaj-form > input[type="text"],
.zawaj-form > textarea{
	width:100%; padding:10px 12px; border:1px solid var(--line); border-radius:10px;
	font-size:14.5px; background:var(--white); color:var(--ink);
}
.zawaj-field textarea{ min-height:90px; resize:vertical; }
.zawaj-field-checkbox label{ font-weight:500; display:flex; align-items:center; gap:8px; color:var(--ink); }
.zawaj-field-range{ display:flex; gap:10px; }
.zawaj-field-range input{ flex:1; }
.zawaj-radio-group{ display:flex; flex-wrap:wrap; gap:12px; }
.zawaj-radio-group label{ font-weight:500; display:flex; align-items:center; gap:6px; color:var(--ink); }
.zawaj-current-photo{ max-width:90px; border-radius:10px; margin-top:8px; display:block; }

.zawaj-inline-form{ display:inline-flex; gap:8px; align-items:center; margin:4px 6px 4px 0; }

.zawaj-form-section-title{
	font-size:18px; color:var(--blue-deep); margin:28px 0 14px; padding-bottom:8px;
	border-bottom:2px solid var(--yellow);
}
.zawaj-danger-title{ border-bottom-color:var(--red); color:var(--red); }

/* ---------------- أزرار ---------------- */
.zawaj-btn{
	display:inline-flex; align-items:center; gap:6px; padding:11px 22px; border-radius:999px;
	font-weight:700; font-size:14px; cursor:pointer; border:1px solid transparent; text-decoration:none;
}
.zawaj-btn-primary{ background:var(--blue); color:#fff; }
.zawaj-btn-primary:hover{ background:var(--blue-deep); }
.zawaj-btn-outline{ background:#fff; color:var(--blue); border-color:var(--blue-line); }
.zawaj-btn-outline:hover{ background:var(--blue-soft); }
.zawaj-btn-danger{ background:var(--red); color:#fff; }
.zawaj-btn-link{ background:none; color:var(--blue); padding:6px 0; }
.zawaj-btn-small{ padding:7px 14px; font-size:12.5px; }

/* ---------------- شرائح/بطاقات عامة ---------------- */
.chips{ display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.chip{
	font-size:12.5px; background:var(--blue-soft); color:var(--blue-deep);
	padding:6px 12px; border-radius:999px; font-weight:600;
}

.badge-list{ display:flex; flex-wrap:wrap; gap:8px; margin:10px 0; }
.badge-pill{
	background:var(--yellow-soft); border:1px solid var(--yellow-line); color:var(--yellow-deep);
	font-size:12.5px; font-weight:700; padding:6px 12px; border-radius:999px;
}

.grid{ display:grid; gap:16px; margin:16px 0; }
.grid.cols-2{ grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr)); }
.grid.cols-3{ grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr)); }
.grid.cols-4{ grid-template-columns:repeat(auto-fit,minmax(min(150px,100%),1fr)); }

.card{
	background:#fff; border:1px solid var(--line); border-radius:14px; padding:18px;
}
.card h3{ margin:0 0 6px; font-size:16px; color:var(--blue-deep); }

.mini-card{
	background:#fff; border:1px solid var(--line); border-radius:12px; padding:14px;
	font-size:13.5px; text-align:center; color:var(--ink-soft);
}
.mini-card strong{ display:block; font-size:20px; color:var(--blue-deep); margin-bottom:2px; }

.note{ font-size:12.5px; color:var(--ink-soft); margin-top:10px; }
.zawaj-muted{ color:var(--ink-soft); font-size:13.5px; margin:4px 0; }

/* ---------------- شريط نسبة الاكتمال ---------------- */
.zawaj-profile-progress{ margin-bottom:20px; }
.zawaj-progress-bar{
	background:var(--blue-soft); border-radius:999px; height:10px; overflow:hidden;
}
.zawaj-progress-bar span{ display:block; height:100%; background:var(--yellow); }
.zawaj-progress-label{ font-size:13px; color:var(--ink-soft); margin-top:6px; }

/* ---------------- الملف الشخصي العام ---------------- */
.zawaj-profile-header{ display:flex; gap:18px; align-items:center; margin-bottom:16px; flex-wrap:wrap; }
.zawaj-profile-photo{
	width:96px; height:96px; border-radius:50%; object-fit:cover; background:var(--blue-soft);
	display:flex; align-items:center; justify-content:center; font-size:34px; flex:none;
}
.zawaj-profile-photo-placeholder{ color:var(--blue); }
.zawaj-profile-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(180px,100%),1fr)); gap:10px; margin:16px 0; }
.zawaj-profile-attr{ background:var(--bg); border-radius:10px; padding:10px 12px; }
.zawaj-attr-label{ display:block; font-size:11.5px; color:var(--ink-soft); }
.zawaj-attr-value{ display:block; font-size:14px; font-weight:700; color:var(--ink); }
.zawaj-profile-bio{ margin:16px 0; }
.zawaj-profile-actions{ display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-top:18px; }

/* ---------------- نتائج البحث ---------------- */
.zawaj-result-card{
	background:#fff; border:1px solid var(--line); border-radius:14px; padding:16px; text-align:center;
}
.zawaj-result-photo{
	width:64px; height:64px; border-radius:50%; object-fit:cover; margin:0 auto 10px;
	display:flex; align-items:center; justify-content:center; background:var(--blue-soft); font-size:24px;
}
.zawaj-result-card h4{ margin:0 0 4px; font-size:15px; }

/* ---------------- لوحة التحكم ---------------- */
.zawaj-tabs{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:20px; border-bottom:1px solid var(--line); padding-bottom:10px; }
.zawaj-tab-link{
	background:var(--blue-soft); color:var(--blue-deep); padding:8px 16px; border-radius:999px;
	font-size:13.5px; font-weight:700; text-decoration:none;
}
.zawaj-tab-link:hover{ background:var(--blue); color:#fff; }
.zawaj-tab-link.is-active{ background:var(--blue-deep); color:#fff; }
.zawaj-tab-panel{ margin-bottom:34px; padding-top:6px; scroll-margin-top:90px; }
.zawaj-tab-panel h3{ color:var(--blue-deep); border-right:4px solid var(--yellow); padding-right:10px; }

.zawaj-request-row{
	display:flex; align-items:center; gap:10px; flex-wrap:wrap; padding:10px 0; border-bottom:1px solid var(--line);
}
.zawaj-status-pill{
	background:var(--yellow-soft); color:var(--yellow-deep); font-size:12px; font-weight:700;
	padding:4px 10px; border-radius:999px;
}
.zawaj-accepted-card{
	background:#fff; border:1px solid var(--line); border-radius:14px; padding:18px; margin-bottom:18px;
}
.zawaj-accepted-card label{ font-size:13px; font-weight:700; margin-inline-end:6px; }
.zawaj-accepted-card select{ padding:6px 10px; border-radius:8px; border:1px solid var(--line); }

.zawaj-message-thread{ margin-top:16px; border-top:1px dashed var(--line); padding-top:14px; }
.zawaj-message-list{ max-height:260px; overflow-y:auto; margin-bottom:12px; display:flex; flex-direction:column; gap:8px; }
.zawaj-message{ max-width:75%; padding:8px 12px; border-radius:12px; font-size:13.5px; }
.zawaj-message p{ margin:0 0 4px; }
.zawaj-message-mine{ background:var(--blue); color:#fff; align-self:flex-end; }
.zawaj-message-theirs{ background:var(--bg); color:var(--ink); align-self:flex-start; }
.zawaj-message-time{ font-size:10.5px; opacity:.75; }
.zawaj-message-form{ display:flex; gap:8px; }
.zawaj-message-form textarea{ flex:1; min-height:44px; }

.zawaj-account-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr)); gap:14px; margin-bottom:10px; }
.zawaj-blocked-list{ list-style:none; padding:0; }
.zawaj-blocked-list li{ display:flex; align-items:center; gap:10px; padding:6px 0; border-bottom:1px solid var(--line); }

.zawaj-report-box summary{ cursor:pointer; }
.zawaj-report-box form{ margin-top:8px; }

/* ---------------- حاسبة تكلفة الزواج ---------------- */
.zawaj-calculator{ max-width:480px; }
.zawaj-calc-total{
	background:var(--blue-soft); color:var(--blue-deep); border-radius:12px; padding:14px;
	font-size:18px; font-weight:700; text-align:center; margin:14px 0 8px;
}
.zawaj-calc-total-value{ color:var(--blue); }
.zawaj-calc-message{ font-weight:600; text-align:center; }
.zawaj-calc-message.is-good{ color:var(--blue-deep); }
.zawaj-calc-message.is-over{ color:var(--yellow-deep); }

/* ---------------- إحصائيات مباشرة ---------------- */
.zawaj-stats-grid .mini-card strong{ color:var(--blue); }

/* ---------------- استجابة للشاشات الصغيرة ---------------- */
@media (max-width: 640px){
	.zawaj-profile-header{ flex-direction:column; text-align:center; }
	.zawaj-tabs{ justify-content:center; }
	.zawaj-message{ max-width:90%; }
}

:focus-visible{ outline:3px solid var(--yellow); outline-offset:2px; }