:root { --ot-ink:#112633; --ot-teal:#087f81; --ot-lime:#b5e07a; --ot-amber:#e8ac4a; }
body { background:#eef3f4; color:var(--ot-ink); }
.navbar-vertical.navbar-light { box-shadow: 5px 0 28px rgba(12,43,54,.08); }
.navbar-vertical .navbar-brand h1 { color:var(--ot-ink); font-weight:800; letter-spacing:-.03em; }
.navbar-vertical .navbar-nav .nav-link:hover { color:var(--ot-teal); background:#e7f6f4; border-radius:12px; }
.card { border-radius:14px; }
.btn-primary, .bg-gradient-primary { background:linear-gradient(135deg,#113747,#087f81)!important; border-color:#087f81!important; }
.btn-success { background:#087f81; border-color:#087f81; }
.btn-primary:hover, .btn-success:hover { background:#07696b!important; border-color:#07696b!important; }
.table thead th { color:#395760; }
.ot-home { background:#071b26; min-height:100vh; color:#e7f3f1; padding:40px clamp(20px,4vw,70px) 60px; position:relative; overflow:hidden; }
.ot-home:before { content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(64,178,166,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(64,178,166,.05) 1px,transparent 1px); background-size:34px 34px; pointer-events:none; }
.ot-home > * { position:relative; }
.ot-eyebrow { color:#aee5d5; letter-spacing:.08em; font-size:.9rem; font-weight:700; }
.ot-title { color:#fff; font-size:clamp(2.5rem,5vw,5rem); font-weight:900; margin:14px 0 20px; }
.ot-title span { color:#9fe0b0; }
.ot-lead { font-size:1.15rem; line-height:2; max-width:760px; color:#d1e4e5; }
.ot-hero { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(260px,.8fr); gap:36px; align-items:center; margin:0 auto 45px; max-width:1280px; }
.ot-flow { border:1px solid rgba(123,206,196,.35); border-radius:22px; padding:26px; background:rgba(13,51,63,.72); box-shadow:0 24px 60px rgba(0,0,0,.18); }
.ot-flow-head { color:#9fe0b0; letter-spacing:.16em; font:700 .8rem monospace; text-align:left; }
.ot-node { padding:13px 18px; border:1px solid rgba(111,205,192,.5); border-radius:12px; margin:16px 0; background:#0d3644; display:flex; justify-content:space-between; font:700 .95rem monospace; direction:ltr; }
.ot-node small { color:#aee5d5; font-weight:400; }
.ot-line { height:20px; border-left:2px dashed #5caea6; margin:-13px 0 -12px 28px; }
.ot-chip { display:inline-block; border:1px solid rgba(158,224,176,.4); color:#bfe8dd; padding:7px 12px; border-radius:999px; margin:4px; font-size:.85rem; }
.ot-section { max-width:1280px; margin:35px auto; }
.ot-section h2 { color:#fff; font-weight:800; margin-bottom:20px; }
.ot-partners { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.ot-partner { background:#f7faf9; border-radius:16px; padding:16px; color:#23424a; text-align:center; min-height:190px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; }
.ot-partner img { max-height:112px; max-width:90%; object-fit:contain; }
.ot-partner strong { font-size:.95rem; }
.ot-countdown { background:linear-gradient(120deg,#0b3c49,#0b5961); border:1px solid #438b8b; border-radius:20px; padding:26px; text-align:center; }
.ot-countdown .date { font-size:1.5rem; font-weight:800; color:#fff; }
.ot-countdown .time { font:700 clamp(1.5rem,4vw,3rem) monospace; color:#bcf0c6; direction:ltr; margin:12px 0 0; }
.ot-time-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; max-width:560px; margin:20px auto 0; }
.ot-time-grid div { background:rgba(4,30,39,.55); border:1px solid rgba(178,237,197,.28); border-radius:12px; padding:10px 4px; }
.ot-time-grid strong { display:block; color:#bcf0c6; font:700 clamp(1.6rem,3vw,2.5rem) monospace; direction:ltr; }
.ot-time-grid span { display:block; color:#d3e9e4; font-size:.8rem; }
.ot-keywords { line-height:2.6; }
.ot-credit { color:#a5c5c7; font-size:.8rem; line-height:1.8; }
.ot-credit a { color:#bbded4; text-decoration:underline; }
@media(max-width:900px) { .ot-hero { grid-template-columns:1fr; } .ot-partners { grid-template-columns:1fr; } }
body { font-family:'Vazirmatn',sans-serif; }
html[lang="en"] body { font-family:'Inter',sans-serif; }
code, pre, .ot-flow-head, .ot-node, .ot-time-grid strong { font-family:'JetBrains Mono','Vazirmatn',monospace; }
html[dir=rtl], html[dir=rtl] body { direction:rtl; text-align:right; }
[dir=rtl] .navbar-vertical.fixed-right { right:0; left:auto; border-width:0 0 0 1px; }
[dir=rtl] .navbar-vertical.fixed-left { right:0; left:auto; border-width:0 0 0 1px; }
[dir=rtl] .navbar-vertical.fixed-right + .main-content, [dir=rtl] .main-content { margin-left:0!important; margin-right:250px!important; }
[dir=rtl] .navbar-vertical .navbar-nav .nav-link { text-align:right; }
[dir=rtl] .navbar-vertical .navbar-nav .nav-link i { margin-left:.75rem; margin-right:0; }
[dir=rtl] .card, [dir=rtl] .card-body, [dir=rtl] .card-header, [dir=rtl] .card-footer { text-align:right; }
[dir=rtl] .table th, [dir=rtl] .table td { text-align:right; }
[dir=rtl] .media .mr-3 { margin-right:0!important; margin-left:1rem!important; }
[dir=rtl] p, [dir=rtl] h1, [dir=rtl] h2, [dir=rtl] h3, [dir=rtl] h4, [dir=rtl] h5, [dir=rtl] h6 { text-align:right; }
[dir=rtl] ul, [dir=rtl] ol { padding-right:1.5rem; padding-left:0; margin-right:0; text-align:right; }
[dir=rtl] .text-left { text-align:right!important; }
[dir=rtl] .text-right { text-align:left!important; }
[dir=rtl] .form-control, [dir=rtl] .custom-select { text-align:right; direction:rtl; }
[dir=rtl] input[type="email"], [dir=rtl] input[type="password"], [dir=rtl] input[type="url"], [dir=rtl] input[type="datetime-local"] { direction:ltr; text-align:left; }
[dir=rtl] .col-form-label { text-align:right!important; }
[dir=rtl] .dropdown-menu { text-align:right; }
[dir=rtl] .dropdown-menu-right { right:auto!important; left:0!important; }
[dir=rtl] .modal-header .close { margin:-1rem auto -1rem -1rem; }
@media(max-width:767.98px){[dir=rtl] .navbar-vertical.fixed-right + .main-content, [dir=rtl] .main-content{margin-left:0!important;margin-right:0!important}.navbar-vertical.fixed-right, .navbar-vertical.fixed-left{right:0;left:auto}}
.ot-theme-mode { position:fixed; bottom:16px; right:118px; z-index:1100; border-radius:999px; box-shadow:0 4px 18px #0003; }
.ot-theme-switch { position:fixed; bottom:16px; right:16px; z-index:1100; border-radius:999px; box-shadow:0 4px 18px #0003; }
[dir=rtl] .ot-theme-mode { right:auto; left:118px; }
[dir=rtl] .ot-theme-switch { right:auto; left:16px; }
.ot-dark { background:#081a22; color:#e6f1f2; }
.ot-dark .navbar-vertical.navbar-light, .ot-dark .card, .ot-dark .card-header, .ot-dark .bg-white, .ot-dark .bg-secondary { background:#102b35!important; color:#e6f1f2!important; border-color:#31505b!important; }
.ot-dark .navbar-vertical .navbar-brand h1, .ot-dark .navbar-vertical .nav-link, .ot-dark .card h1, .ot-dark .card h2, .ot-dark .card h3, .ot-dark .card h4, .ot-dark .table, .ot-dark .table thead th, .ot-dark .text-muted { color:#dcebed!important; }
.ot-dark .form-control, .ot-dark .custom-select { background:#0b222c!important; color:#f0f8f7!important; border-color:#43616b!important; }
.ot-dark .form-control::placeholder { color:#aec1c6; }
.ot-dark .table td, .ot-dark .table th { border-color:#34525b; }
.ot-dark a:not(.btn):not(.nav-link) { color:#8de1d6; }
.ot-dark .alert-info { background:#123c48; border-color:#347985; color:#e3f7f6; }
.ot-dark .ot-home { background:#061821; }
.ot-rings { position:relative; width:min(270px,70vw); aspect-ratio:1; margin:12px auto; }
.ot-ring-svg { width:100%;height:100%; transform:rotate(-90deg); }
.ot-ring-track,.ot-ring-value { fill:none;stroke-width:8; }
.ot-ring-track { stroke:#ffffff24; }
.ot-ring-value { stroke:#b5ed91; stroke-linecap:round; transition:stroke-dashoffset .5s linear; }
.ring-days { stroke:#e8ac4a; stroke-dasharray:703.7; }
.ring-hours { stroke:#55d2c2; stroke-dasharray:521.5; }
.ring-seconds { stroke:#b5ed91; stroke-dasharray:339.3; }
.ot-ring-center { position:absolute; inset:0; display:grid; align-content:center; justify-items:center; pointer-events:none; color:#eaf8f2; }
.ot-ring-center div { display:flex; align-items:baseline; gap:7px; line-height:1.2; }
.ot-ring-center div:nth-child(1) strong { font-size:1.5rem; }
.ot-ring-center div:nth-child(2) strong { font-size:1.25rem; }
.ot-ring-center div:nth-child(3) strong { font-size:1rem; }
.ot-ring-center strong { font-family:'JetBrains Mono',monospace; }
.ot-ring-center span { font-size:.7rem; }
.ot-cloud-wrap { min-height:430px; }
.ot-cloud { width:100%; height:440px; direction:ltr; }
html[lang="fa"] .ot-lead { line-height:2; }
.ot-node { text-align:left; }
.ot-logo-img { width:84px; height:84px; object-fit:contain; }
.ot-sidebar-brand { display:flex; align-items:center; justify-content:center; width:100%; min-height:82px; }
.ot-sidebar-logo { width:76px; height:76px; object-fit:contain; margin:0; }
@media (max-width:767.98px) {
  .ot-sidebar-brand { width:auto; min-height:48px; }
  .ot-sidebar-logo { width:46px; height:46px; }
}
.ot-badge-panel { padding:20px; border:1px solid rgba(69,205,209,.4); border-radius:24px; background:radial-gradient(circle at 50% 35%,rgba(25,101,122,.5),rgba(5,25,41,.95) 70%); text-align:center; box-shadow:0 24px 60px rgba(0,0,0,.24); }
.ot-badge-panel > img { display:block; width:min(100%,430px); margin:8px auto; filter:drop-shadow(0 16px 28px rgba(0,0,0,.35)); }
.ot-badge-kicker { font:700 .78rem 'JetBrains Mono',monospace; color:#84e0d8; letter-spacing:.08em; }
.ot-badge-specs { display:flex; justify-content:center; flex-wrap:wrap; gap:7px; margin:8px 0 14px; }
.ot-badge-specs span { padding:5px 9px; border:1px solid rgba(224,170,97,.5); border-radius:999px; color:#f4d4ab; font:600 .7rem 'JetBrains Mono',monospace; }
.ot-badge-panel a { color:#9de6de; font-weight:700; }
.ot-partner-gohar { background:#0b2639; color:#fff; }
.ot-partner-gohar img { max-height:115px; }
.ot-site-footer { padding:34px clamp(20px,4vw,65px); background:#071b26; color:#d9e9e9; }
.ot-footer-brand { display:flex; align-items:center; justify-content:center; gap:12px; text-align:start; }
.ot-footer-brand img { width:48px; height:48px; object-fit:contain; }
.ot-footer-brand strong,.ot-footer-brand span { display:block; }
.ot-footer-brand span { color:#9abdbf; font-size:.83rem; }
.ot-footer-keywords { max-width:1000px; margin:18px auto; line-height:2; text-align:center; color:#85cfc9; font-size:.79rem; }
.ot-footer-links { display:flex; justify-content:center; flex-wrap:wrap; gap:20px; }
.ot-footer-links a { color:#d9e9e9; }

/* Logo Styling */
.ot-logo-wrap { display:inline-block; margin-bottom:14px; filter:drop-shadow(0 0 14px rgba(56,189,248,.25)); transition:transform .3s ease, filter .3s ease; }
.ot-logo-wrap:hover { transform:scale(1.06); filter:drop-shadow(0 0 22px rgba(56,189,248,.45)); }

/* Collapsible Sidebar Styles */
.navbar-vertical {
  transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.28s ease !important;
  z-index: 1040;
}
.main-content {
  transition: margin-left 0.28s cubic-bezier(0.4, 0, 0.2, 1), margin-right 0.28s cubic-bezier(0.4, 0, 0.2, 1) !important;
  overflow-x: hidden;
}

/* LTR Collapsed */
body.sidebar-collapsed .navbar-vertical.fixed-left,
html.sidebar-collapsed body .navbar-vertical.fixed-left {
  transform: translateX(-100%) !important;
}
body.sidebar-collapsed .navbar-vertical.fixed-left + .main-content,
body.sidebar-collapsed .main-content,
html.sidebar-collapsed body .main-content {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* RTL Collapsed */
[dir=rtl] body.sidebar-collapsed .navbar-vertical.fixed-right,
[dir=rtl] body.sidebar-collapsed .navbar-vertical.fixed-left,
html[dir=rtl].sidebar-collapsed body .navbar-vertical.fixed-right,
html[dir=rtl].sidebar-collapsed body .navbar-vertical.fixed-left {
  transform: translateX(100%) !important;
}
[dir=rtl] body.sidebar-collapsed .navbar-vertical.fixed-right + .main-content,
[dir=rtl] body.sidebar-collapsed .navbar-vertical.fixed-left + .main-content,
[dir=rtl] body.sidebar-collapsed .main-content,
html[dir=rtl].sidebar-collapsed body .main-content {
  margin-right: 0 !important;
  margin-left: 0 !important;
}

#sidebarCollapseToggle {
  cursor: pointer;
  border-radius: 8px;
  padding: 6px 14px;
  background: rgba(255, 255, 255, 0.16);
  border: 1px solid rgba(255, 255, 255, 0.28);
  color: #ffffff;
  transition: all 0.2s ease;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
#sidebarCollapseToggle:hover {
  background: rgba(255, 255, 255, 0.3);
  color: #ffffff;
}
.ot-dark #sidebarCollapseToggle {
  background: rgba(16, 43, 53, 0.75);
  border-color: rgba(56, 189, 248, 0.35);
  color: #aee5d5 !important;
}
.ot-dark #sidebarCollapseToggle:hover {
  background: rgba(16, 43, 53, 0.95);
  border-color: #38bdf8;
}