/*
Theme Name: SLTY - سلطان ابراهيم أحمد التجارية
Theme URI: https://slty.org
Author: تقنيتك (taqniatec.com)
Author URI: https://taqniatec.com
Description: قالب ووردبرس عربي (RTL) لشركة سلطان ابراهيم أحمد التجارية. ثلاثة قطاعات: التخليص الجمركي، تقنية المعلومات، وقطع غيار وتبريد السيارات. الهوية: كحلي وذهبي.
Version: 1.4
Text Domain: slty
*/

* { box-sizing: border-box; }
html { direction: rtl; }
body {
  margin: 0;
  font-family: 'Tajawal', sans-serif;
  background: #f6f2ea;
  color: #101d38;
}
a { color: #a9853f; text-decoration: none; }
a:hover { color: #c6a15c; }
img { max-width: 100%; display: block; }

.slty-wrap { width: 100%; max-width: 1280px; margin: 0 auto; }

/* header */
.slty-header {
  background: #f6f2ea;
  display: flex; align-items: center; justify-content: space-between;
  padding: 22px 56px; border-bottom: 1px solid rgba(16,29,56,.1);
  position: sticky; top: 0; z-index: 30;
}
.slty-brand { display: flex; align-items: center; gap: 14px; }
.slty-brand img { width: 56px; height: 56px; border-radius: 12px; }
.slty-brand .name { font-family: 'Almarai'; color: #101d38; font-weight: 800; font-size: 17px; line-height: 1.3; }
.slty-brand .sub { color: #a9853f; font-size: 12px; letter-spacing: 2px; }
.slty-nav { display: flex; align-items: center; gap: 34px; font-size: 15.5px; font-weight: 500; }
.slty-nav a { color: #43506b; }
.slty-nav a.active { color: #101d38; font-weight: 700; }
.slty-nav a.btn { background: #101d38; color: #f6f2ea; padding: 10px 22px; border-radius: 999px; }
.slty-nav a.btn:hover { background: #16233f; color: #f6f2ea; }

/* footer */
.slty-footer {
  background: #0b1428; padding: 44px 56px;
  display: flex; align-items: center; justify-content: space-between;
  color: #7f889b; font-size: 14px;
}
.slty-footer .brand { display: flex; align-items: center; gap: 12px; }
.slty-footer .brand img { width: 40px; height: 40px; border-radius: 9px; }
.slty-footer .credit { display: flex; align-items: center; gap: 8px; }
.slty-footer .credit a { color: #c6a15c; display: inline-flex; align-items: center; gap: 6px; }
.slty-footer .credit a strong { font-weight: 800; }
.slty-footer .credit a:hover { color: #d9bd83; }
details summary::-webkit-details-marker { display: none; }
details[open] summary span { transform: rotate(45deg); }
details summary span { transition: transform .2s ease; display: inline-block; }

@media (max-width: 820px) {
  .slty-header { flex-direction: column; gap: 16px; padding: 18px 22px; }
  .slty-nav { gap: 18px; flex-wrap: wrap; justify-content: center; }
  .slty-footer { flex-direction: column; gap: 14px; text-align: center; padding: 32px 22px; }
}

/* ---------- قائمة صفحات تهمك ---------- */
.slty-dd { position: relative; }
.slty-dd-toggle {
  background: none; border: none; cursor: pointer; font: inherit;
  color: #43506b; display: inline-flex; align-items: center; gap: 6px; padding: 0;
}
.slty-dd-toggle.active { color: #101d38; font-weight: 700; }
.slty-dd-toggle .caret { color: #a9853f; transition: transform .2s ease; }
.slty-dd.open .caret { transform: rotate(180deg); }
.slty-dd-menu {
  display: none; position: absolute; top: calc(100% + 14px); right: 0; min-width: 260px;
  background: #fff; border: 1px solid rgba(16,29,56,.1); border-radius: 12px;
  box-shadow: 0 18px 40px rgba(16,29,56,.14); padding: 8px; z-index: 40;
}
.slty-dd.open .slty-dd-menu { display: block; }
.slty-dd-menu a {
  display: block; padding: 11px 14px; border-radius: 8px;
  color: #43506b; font-size: 15px; font-weight: 500;
}
.slty-dd-menu a:hover { background: #f6f2ea; color: #101d38; }

/* ---------- نموذج التواصل ---------- */
.slty-form {
  direction: rtl; text-align: right;
  background: #16233f; border: 1px solid rgba(198,161,92,.22);
  border-radius: 16px; padding: 30px;
}
.slty-form .slty-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.slty-form .slty-field { margin-bottom: 14px; }
.slty-form label {
  display: block; color: #c6a15c; font-size: 14px; margin-bottom: 8px; text-align: right;
}
.slty-form input,
.slty-form select,
.slty-form textarea {
  width: 100%; direction: rtl; text-align: right;
  background: #0f1b34; border: 1px solid rgba(255,255,255,.1); border-radius: 8px;
  padding: 13px 16px; color: #f6f2ea; font-size: 15px; font-family: inherit;
}
.slty-form select { color: #c9d0de; }
.slty-form textarea { height: 110px; resize: vertical; }
.slty-form ::placeholder { color: #8f98ac; text-align: right; }
.slty-form input:focus,
.slty-form select:focus,
.slty-form textarea:focus { outline: none; border-color: rgba(198,161,92,.6); }
.slty-submit {
  width: 100%; background: #c6a15c; color: #101d38; font-weight: 700; font-size: 16px;
  padding: 15px; border: none; border-radius: 8px; cursor: pointer; font-family: inherit;
}
.slty-submit:hover { background: #d9bd83; }
.slty-submit:disabled { opacity: .7; cursor: default; }
.slty-alert { display: none; margin-top: 16px; padding: 14px 16px; border-radius: 8px; font-size: 15px; line-height: 1.7; text-align: right; }
.slty-alert.is-success { display: block; background: rgba(70,160,110,.14); border: 1px solid rgba(70,160,110,.5); color: #9ee3bf; }
.slty-alert.is-error { display: block; background: rgba(200,70,70,.12); border: 1px solid rgba(200,70,70,.45); color: #f3b1b1; }

@media (max-width: 640px) {
  .slty-form .slty-row { grid-template-columns: 1fr; }
}