/* TASIM account workspace. Loaded after the shared public styles by design. */
body.tasim-theme-travelflow .tf-live-account,
body.tasim-theme-travelflow .tf-live-account *,
body.tasim-theme-travelflow .tf-live-account *::before,
body.tasim-theme-travelflow .tf-live-account *::after { box-sizing:border-box!important; font-family:"Rubik",sans-serif!important }
body.tasim-theme-travelflow .tf-live-account.account-shell { min-height:calc(100dvh - 74px)!important; padding:clamp(14px,2.4vw,32px)!important; overflow-x:clip!important; color:#0b1d33!important; background:radial-gradient(circle at 8% 2%,rgba(0,167,157,.1),transparent 26rem),radial-gradient(circle at 96% 10%,rgba(255,90,60,.09),transparent 24rem),#f7f2ea!important }
body.tasim-theme-travelflow .tf-live-account .account-panel { width:min(1240px,100%)!important; margin:0 auto!important; padding:0!important; border:0!important; background:transparent!important; box-shadow:none!important }
.tasim-account-app { display:grid!important; grid-template-columns:minmax(210px,244px) minmax(0,1fr)!important; gap:clamp(16px,2.4vw,30px)!important; align-items:start!important }
.tasim-account-sidebar { position:sticky!important; inset-block-start:92px!important; display:grid!important; gap:16px!important; padding:18px!important; border:1px solid #e5ddd1!important; border-radius:24px!important; background:rgba(255,255,255,.97)!important; box-shadow:0 18px 44px rgba(11,29,51,.08)!important }
.tasim-account-sidebar-head { display:grid!important; gap:3px!important; padding:4px 6px 14px!important; border-bottom:1px solid #ece5db!important }
.tasim-account-sidebar-head .eyebrow { color:#b93321!important; font-size:12px!important; font-weight:800!important }
.tasim-account-sidebar-head strong { color:#0b1d33!important; font-size:22px!important; line-height:1.2!important }
.tasim-account-nav { display:grid!important; gap:6px!important }
.tasim-account-nav a { display:grid!important; grid-template-columns:30px minmax(0,1fr)!important; gap:10px!important; align-items:center!important; min-height:48px!important; padding:8px 10px!important; border:1px solid transparent!important; border-radius:14px!important; color:#344054!important; font-size:14px!important; font-weight:750!important; line-height:1.25!important; text-decoration:none!important }
.tasim-account-nav a>span { display:grid!important; place-items:center!important; width:30px!important; height:30px!important; border-radius:10px!important; background:#eef8f6!important; color:#087f78!important; font-size:11px!important; font-weight:850!important }
.tasim-account-nav a:is(:hover,:focus-visible),.tasim-account-nav a[aria-current=page] { border-color:rgba(0,151,143,.26)!important; background:#e9f7f5!important; color:#0b1d33!important }
.tasim-account-nav a[aria-current=page]>span { background:#00736d!important; color:#fff!important }
.tasim-account-support-link { display:grid!important; place-items:center!important; min-height:46px!important; border:1px solid #c8dedb!important; border-radius:14px!important; background:#fff!important; color:#0b1d33!important; font-weight:800!important; text-decoration:none!important }
.tasim-account-mobile-nav { display:none!important }
.tasim-account-main { min-width:0!important }
.tf-live-account [data-account-view][hidden] { display:none!important }
.tf-live-account [data-account-view][data-account-active] { animation:tasimAccountViewIn .18s ease-out both }
@keyframes tasimAccountViewIn { from{opacity:0;transform:translateY(5px)} to{opacity:1;transform:none} }
@media (prefers-reduced-motion:reduce) { .tf-live-account [data-account-view][data-account-active]{animation:none!important} }
.tf-live-account .account-view-header,.tf-live-account .account-orders-heading { display:grid!important; gap:6px!important; margin:0 0 16px!important; padding:clamp(18px,3vw,30px)!important; border:1px solid #e5ddd1!important; border-radius:24px!important; background:linear-gradient(135deg,#fff,#effaf8)!important; box-shadow:0 14px 34px rgba(11,29,51,.06)!important }
.tf-live-account .account-view-header h2,.tf-live-account .account-orders-heading h2 { margin:0!important; color:#0b1d33!important; font-size:clamp(26px,3.4vw,42px)!important; line-height:1.12!important }
.tf-live-account .account-view-header p { margin:0!important; color:#667085!important; font-size:15px!important }
.tf-live-account .tasim-account-dashboard { display:grid!important; gap:16px!important; margin:0!important }
.tf-live-account .tasim-account-hero { min-height:230px!important; display:grid!important; align-content:center!important; gap:8px!important; padding:clamp(24px,4vw,44px)!important; border:1px solid rgba(255,255,255,.14)!important; border-radius:28px!important; overflow:hidden!important; color:#fff!important; background:radial-gradient(circle at 12% 18%,rgba(0,183,167,.3),transparent 34%),linear-gradient(135deg,#0b1d33,#124b5c)!important; box-shadow:0 22px 54px rgba(11,29,51,.18)!important }
.tf-live-account .tasim-account-hero h1 { margin:0!important; color:#fff!important; font-size:clamp(34px,5vw,58px)!important; line-height:1.05!important; overflow-wrap:anywhere!important }
.tf-live-account .tasim-account-hero .eyebrow { color:#ffd2c8!important }
.tf-live-account .tasim-account-hero p { max-width:58ch!important; margin:0!important; color:rgba(255,255,255,.84)!important; font-size:clamp(15px,1.7vw,18px)!important; line-height:1.55!important }
.tf-live-account .tasim-account-sections { display:grid!important; grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:10px!important }
.tf-live-account .tasim-account-sections a { display:grid!important; place-items:center!important; min-height:48px!important; padding:8px 12px!important; border:1px solid #c9dfdc!important; border-radius:14px!important; background:#fff!important; color:#0b1d33!important; font-size:14px!important; font-weight:800!important; text-align:center!important; text-decoration:none!important }
.tf-live-account .tasim-account-kpis { display:grid!important; grid-template-columns:repeat(4,minmax(0,1fr))!important; gap:12px!important }
.tf-live-account .tasim-account-kpis article,.tf-live-account .tasim-account-card { min-width:0!important; padding:18px!important; border:1px solid #e5ddd1!important; border-radius:20px!important; background:#fff!important; box-shadow:0 12px 30px rgba(11,29,51,.055)!important }
.tf-live-account .tasim-account-kpis article { min-height:110px!important; display:grid!important; align-content:space-between!important; border-block-start:4px solid #00736d!important }
.tf-live-account .tasim-account-kpis strong { color:#0b1d33!important; font-size:clamp(25px,3vw,34px)!important }
.tf-live-account .tasim-account-action-grid { display:grid!important; grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:12px!important }
.tf-live-account .tasim-account-card { min-height:178px!important; display:flex!important; flex-direction:column!important; align-items:flex-start!important; gap:8px!important }
.tf-live-account .tasim-account-card :is(p,span) { color:#667085!important; line-height:1.5!important }
.tf-live-account .tasim-account-card .button { margin-block-start:auto!important }
.tf-live-account .account-identity-line { display:flex!important; justify-content:space-between!important; gap:14px!important; margin:0!important; padding:14px 18px!important; border:1px solid #d8e5e2!important; border-radius:16px!important; background:#f2faf8!important; color:#344054!important }
.tf-live-account .account-profile-grid { display:grid!important; grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr)!important; gap:16px!important; margin:0!important }
.tf-live-account :is(.profile-edit-form,.account-security-card,.family-card,.benefit-wallet-card,.account-privacy-card,.account-order-group-card) { border:1px solid #e5ddd1!important; border-radius:22px!important; background:#fff!important; box-shadow:0 14px 34px rgba(11,29,51,.06)!important }
.tf-live-account .profile-edit-form { display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:16px!important; padding:22px!important }
.tf-live-account .profile-edit-form>.profile-field { display:grid!important; grid-template-rows:auto auto!important; align-content:start!important; gap:8px!important; min-width:0!important }
.tf-live-account .profile-edit-form>.profile-field>label:first-child { display:grid!important; grid-template-rows:auto 48px!important; align-content:start!important; gap:7px!important }
.tf-live-account .profile-edit-form>.profile-field small { display:block!important; min-height:1.35em!important; color:#667085!important; font-size:12px!important; line-height:1.35!important }
.tf-live-account .profile-edit-form>.profile-email-field .checkbox-line { display:grid!important; grid-template-columns:24px minmax(0,1fr)!important; align-items:start!important; gap:9px!important; margin:0!important }
.tf-live-account .profile-edit-form>.profile-birth-field .form-error { color:#b42318!important; font-size:13px!important; font-style:normal!important; font-weight:750!important }
.tf-live-account .profile-edit-form>:is(.choice-fieldset,.structure-fieldset,.company-fields,button[type=submit]) { grid-column:1/-1!important }
.tf-live-account .profile-edit-form label,.tf-live-account .family-add-form label { display:grid!important; gap:7px!important; color:#344054!important; font-size:14px!important; font-weight:750!important }
.tf-live-account :is(input:not([type=radio]):not([type=checkbox]),select,textarea,.custom-select-trigger) { width:100%!important; min-height:48px!important; padding:10px 13px!important; border:1px solid #cfc7bd!important; border-radius:12px!important; background:#fff!important; color:#0b1d33!important; font-size:16px!important }
.tf-live-account :is(input,select,textarea,button,a,summary):focus-visible { outline:3px solid rgba(0,115,109,.42)!important; outline-offset:3px!important }
.tf-live-account .choice-fieldset { display:grid!important; grid-template-columns:repeat(auto-fit,minmax(128px,1fr))!important; gap:8px!important; min-width:0!important; padding:16px!important; border:1px solid #ddd5ca!important; border-radius:16px!important }
.tf-live-account .choice-fieldset label,.tf-live-account .checkbox-line,.tf-live-account .security-toggle,.tf-live-account .security-option-row { min-height:44px!important; cursor:pointer!important }
.tf-live-account :is(input[type=radio],input[type=checkbox]) { width:24px!important; height:24px!important; accent-color:#00736d!important }
.tf-live-account .account-security-card { align-self:start!important; display:grid!important; gap:14px!important; padding:22px!important }
.tf-live-account .security-card-head { display:grid!important; justify-items:center!important; gap:8px!important; text-align:center!important }
.tf-live-account .security-card-icon { display:block!important; width:100px!important; height:100px!important; margin:0 auto 4px!important; object-fit:contain!important }
.tf-live-account .security-card-head strong { font-size:clamp(22px,3vw,30px)!important; line-height:1.15!important }
.tf-live-account .security-card-head p { max-width:42rem!important; margin:0 auto!important; color:#667085!important; line-height:1.55!important }
.tf-live-account .security-toggle,.tf-live-account .security-option-row { display:grid!important; grid-template-columns:minmax(0,1fr) auto!important; align-items:center!important; gap:12px!important; min-width:0!important; padding:14px!important; border:1px solid #d8e5e2!important; border-radius:16px!important; background:#f8fbfa!important }
.tf-live-account .security-toggle>span,.tf-live-account .security-option-row>div { display:grid!important; gap:5px!important; min-width:0!important }
.tf-live-account .security-toggle strong,.tf-live-account .security-option-row strong { color:#0b1d33!important; font-size:15px!important; line-height:1.35!important }
.tf-live-account .security-toggle small,.tf-live-account .security-option-row span:not(.pill) { color:#667085!important; font-size:13px!important; line-height:1.5!important; overflow-wrap:anywhere!important }
.tf-live-account .security-toggle input,.tf-live-account .security-option-row input { inline-size:24px!important; block-size:24px!important; margin:0!important; accent-color:#00736d!important }
.tf-live-account .security-option-list { display:grid!important; gap:10px!important; min-width:0!important }
.tf-live-account .security-option-row.is-planned { grid-template-areas:"copy control" "badge badge"!important; opacity:.88!important }
.tf-live-account .security-option-row.is-planned>div { grid-area:copy!important }
.tf-live-account .security-option-row.is-planned>input { grid-area:control!important }
.tf-live-account .security-option-row .pill { grid-area:badge!important; justify-self:start!important; padding:4px 10px!important; border:1px solid #b8deda!important; border-radius:999px!important; background:#e9f7f5!important; color:#075f5a!important; font-size:12px!important; font-weight:800!important; line-height:1.3!important }
.tf-live-account :is(.family-card,.benefit-wallet-card,.account-privacy-card) { padding:clamp(18px,3vw,30px)!important }
.tf-live-account .family-add-form { display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:14px!important }
.tf-live-account .custom-select-trigger { min-height:48px!important }
.tf-live-account .family-member-row { min-height:72px!important; padding:14px!important; border:1px solid #e5ddd1!important; border-radius:16px!important; background:#fbfaf8!important }
.tf-live-account .benefit-wallet-grid { display:grid!important; grid-template-columns:minmax(0,1.2fr) minmax(270px,.8fr)!important; gap:16px!important }
.tf-live-account .affiliate-qr { width:min(220px,100%)!important; height:auto!important; aspect-ratio:1!important }
.tf-live-account .affiliate-link-row,.tf-live-account .affiliate-phone-share { display:grid!important; grid-template-columns:minmax(0,1fr) auto!important; gap:8px!important; align-items:center!important }
.tf-live-account .benefit-wallet-stats { display:grid!important; grid-template-columns:repeat(5,minmax(0,1fr))!important; gap:10px!important }
.tf-live-account .benefit-wallet-stats>div { min-width:0!important; padding:14px!important; border:1px solid #e5ddd1!important; border-radius:16px!important; background:#fbfaf8!important }
.tf-live-account .account-package-list { display:grid!important; gap:12px!important }
.tf-live-account .account-order-group-card { min-width:0!important; overflow:visible!important }
.tf-live-account .account-order-group-card>summary { min-height:112px!important; padding:18px!important; cursor:pointer!important; list-style-position:inside!important }
.tf-live-account .account-order-group-card>summary::marker { color:#00736d!important }
.tf-live-account .usage-progress { position:relative!important; min-width:0!important; height:32px!important; overflow:hidden!important; border-radius:999px!important; background:#eadfce!important }
.tf-live-account .usage-progress-fill { position:absolute!important; inset:0 auto 0 0!important; width:var(--usage-percent,0%)!important; min-width:0!important; height:100%!important; background:#00736d!important }
html[dir=rtl] .tf-live-account .usage-progress-fill { inset:0 0 0 auto!important }
.tf-live-account .usage-progress-text { position:relative!important; z-index:1!important; display:grid!important; place-items:center!important; min-height:32px!important; padding-inline:10px!important; color:#0b1d33!important; font-size:12px!important; font-weight:800!important; line-height:1!important; white-space:nowrap!important }
.tf-live-account .account-order-detail { padding:18px!important; border-top:1px solid #e5ddd1!important }
.tf-live-account .order-common-grid,.tf-live-account .subscriber-mini-grid { display:grid!important; grid-template-columns:repeat(4,minmax(0,1fr))!important; gap:10px!important }
.tf-live-account .activation-copy { display:grid!important; grid-template-columns:minmax(0,1fr) minmax(160px,220px)!important; gap:14px!important; padding:16px!important; border:1px solid #d8e5e2!important; border-radius:16px!important; background:#f4faf9!important }
.tf-live-account .account-activation-qr { grid-row:1/span 4!important; grid-column:2!important; width:100%!important; max-width:220px!important; justify-self:center!important }
.tf-live-account .activation-copy code { max-width:100%!important; padding:12px!important; border-radius:10px!important; background:#0b1d33!important; color:#fff!important; overflow-wrap:anywhere!important; white-space:normal!important }
.tf-live-account .activation-locked { display:grid!important; gap:8px!important; justify-items:start!important; padding:16px!important; border:1px solid #bedbd7!important; border-radius:16px!important; background:#f0faf8!important }
.tf-live-account .activation-locked p { margin:0!important; color:#526174!important }
.tf-live-account :is(.account-view-header,.account-orders-heading) h2[tabindex="-1"]:focus { outline:none!important }
body:has(.tf-live-account) .tasim-noya-launcher { width:52px!important; height:82px!important; max-width:52px!important; max-height:82px!important }
.tf-live-account .account-danger-actions { display:grid!important; grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:10px!important; margin-top:20px!important; padding-top:20px!important; border-top:1px solid #ead7d2!important }
.tf-live-account .account-danger-actions .button { width:100%!important; min-height:48px!important }
@media (max-width:1000px) {
  .tasim-account-app { grid-template-columns:210px minmax(0,1fr)!important; gap:16px!important }
  .tf-live-account .tasim-account-kpis { grid-template-columns:repeat(2,minmax(0,1fr))!important }
  .tf-live-account :is(.tasim-account-action-grid,.account-profile-grid,.benefit-wallet-grid) { grid-template-columns:1fr!important }
  .tf-live-account .benefit-wallet-stats { grid-template-columns:repeat(3,minmax(0,1fr))!important }
}
@media (max-width:760px) {
  body.tasim-theme-travelflow .tf-live-account.account-shell { padding:12px!important }
  .tasim-account-app { grid-template-columns:1fr!important; gap:12px!important }
  .tasim-account-sidebar { position:static!important; display:grid!important; grid-template-columns:minmax(0,1fr) auto!important; gap:10px!important; padding:12px!important; border-radius:18px!important }
  .tasim-account-sidebar-head,.tasim-account-nav { display:none!important }
  .tasim-account-mobile-nav { display:grid!important; gap:5px!important; min-width:0!important; color:#344054!important; font-size:12px!important; font-weight:800!important }
  .tasim-account-mobile-nav select { min-height:48px!important }
  .tasim-account-support-link { align-self:end!important; min-width:78px!important }
  .tasim-account-main { padding-bottom:0!important }
  .tf-live-account .tasim-account-hero { min-height:210px!important; border-radius:22px!important }
  .tf-live-account .tasim-account-sections { display:none!important }
  .tf-live-account :is(.tasim-account-action-grid,.profile-edit-form,.family-add-form,.benefit-wallet-stats,.order-common-grid,.subscriber-mini-grid,.account-danger-actions) { grid-template-columns:1fr!important }
  .tf-live-account .profile-edit-form>* { grid-column:1!important }
  .tf-live-account :is(.affiliate-link-row,.affiliate-phone-share) { grid-template-columns:1fr!important }
  .tf-live-account :is(.affiliate-link-row,.affiliate-phone-share) .button { width:100%!important; min-height:48px!important }
  .tf-live-account .affiliate-table { min-width:0!important }
  .tf-live-account .affiliate-table thead { display:none!important }
  .tf-live-account .affiliate-table :is(tbody,tr,td) { display:block!important; width:100%!important }
  .tf-live-account .affiliate-table tr { margin-bottom:10px!important; padding:12px!important; border:1px solid #e5ddd1!important; border-radius:14px!important; background:#fbfaf8!important }
  .tf-live-account .affiliate-table td { padding:4px 0!important; border:0!important; overflow-wrap:anywhere!important }
  .tf-live-account .activation-copy { grid-template-columns:1fr!important }
  .tf-live-account .account-activation-qr { grid-row:auto!important; grid-column:1!important; width:min(230px,100%)!important }
  body:has(.tf-live-account) .floating-actions { position:fixed!important }
}
@media (max-width:359px) {
  body.tasim-theme-travelflow .tf-live-account.account-shell { padding-inline:8px!important }
  .tasim-account-sidebar { grid-template-columns:1fr!important }
  .tasim-account-support-link { min-height:44px!important }
  .tf-live-account .tasim-account-hero { min-height:190px!important; padding:18px!important }
  .tf-live-account .tasim-account-hero h1 { font-size:clamp(28px,12vw,36px)!important }
  .tf-live-account :is(.tasim-account-sections,.tasim-account-kpis) { grid-template-columns:1fr!important }
  .tf-live-account :is(.profile-edit-form,.account-security-card,.family-card,.benefit-wallet-card,.account-privacy-card) { padding:14px!important }
  .tf-live-account .security-card-icon { width:82px!important; height:82px!important }
  .tf-live-account .security-toggle,.tf-live-account .security-option-row { padding:12px!important; gap:10px!important }
  .tf-live-account .choice-fieldset { grid-template-columns:1fr!important }
  body:has(.tf-live-account) .tasim-noya-launcher { width:44px!important; height:70px!important; max-width:44px!important; max-height:70px!important }
}
