/* ==========================================================
   design/a11y.css — ধাপ ১৬: ল্যান্ডমার্ক ও প্রবেশযোগ্যতা
   সব পেজে tokens.css-এর পরে, বাকি CSS-এর শেষে লোড হয়।
   ব্রেকপয়েন্ট: ৫৭৬ (ছোট ফোন), ৭৬৮, ৯৯২ (ডেস্কটপ শুরু), ১২০০
   ========================================================== */

/* ---- ১. skip-link: Tab চাপলে প্রথমেই আসে, ফোকাস পেলে ওপরে ভেসে ওঠে ---- */
.skip-link{
  position:fixed; top:8px; left:8px; z-index:var(--z-toast,1200);
  padding:12px 18px; min-height:var(--tap-min,44px); display:inline-flex; align-items:center;
  background:var(--surface,#fff); color:var(--text,#0f172a); font-weight:700; text-decoration:none;
  border:2px solid var(--focus-ring,#4f46e5); border-radius:var(--radius-sm,12px);
  transform:translateY(-200%); transition:transform .15s ease;
}
.skip-link:focus,.skip-link:focus-visible{ transform:translateY(0); }
[tabindex="-1"]:focus{ outline:none; }   /* skip-link ও aria-busy-র গন্তব্যে রিং লাগে না */

/* ---- ২. ফোকাস রিং: কিবোর্ডে সবখানে দেখা যায়, মাউস/টাচে আসে না ---- */
:where(a,button,input,select,textarea,summary,[role="button"],[role="option"],[tabindex]):focus-visible{
  outline:3px solid var(--focus-ring,#4f46e5); outline-offset:2px;
}
/* ইনপুট/সিলেক্টে আগে থেকে box-shadow রিং আছে (theme.css, picker.css); সেটার সাথে ৩ px আউটলাইনও থাকে */
input:focus-visible,select:focus-visible,textarea:focus-visible,.pk-trig:focus-visible,.dd-search:focus-visible,.lg-in:focus-visible{
  outline:3px solid var(--focus-ring,#4f46e5) !important; outline-offset:1px;
}
.platform-btn:focus-visible,.platform-link:focus-visible{ outline-color:var(--focus-ring,#4f46e5); }
.pb-bnav-btn:focus-visible{ outline:3px solid var(--focus-ring,#4f46e5); outline-offset:-3px; }

/* ---- ৩. টাচ-টার্গেট ≥ ৪৪ px (ডেস্কটপে মাউস থাকলে ৯৯২+ এ আগের মাপই থাকে) ---- */
@media (max-width:991.98px), (pointer:coarse){
  :where(button,[role="button"],select,summary,input[type="submit"],input[type="button"],
         .pb-btn,.pb-side-item,.site-nav-tab,.footer-links a,.pb-oh-tool,.pk-trig,.pb-nav-link){
    min-height:var(--tap-min,44px);
  }
  :where(.pb-menu-btn,.pb-sidebar-close,.pb-acct-avatar,.platform-btn,.pb-bnav-btn){
    min-width:var(--tap-min,44px); min-height:var(--tap-min,44px);
  }
  :where(input[type="checkbox"],input[type="radio"]){ min-width:24px; min-height:24px; }
  /* লেখার ভেতরের লিংক বাদ; একা-দাঁড়ানো লিংক-তালিকা (ফুটার, নীতিমালার নেভ) ৪৪ px */
  .pg-nav a,.pg-back,.pg-brand{ display:inline-flex; align-items:center; min-height:var(--tap-min,44px); }
}
@media (max-width:575.98px){
  /* ছোট ফোনে পাশাপাশি বাটনের ফাঁক কমপক্ষে ৮ px, যেন ভুল চাপ না পড়ে */
  .site-nav-tabs{ gap:8px; }
  .footer-links{ gap:4px 16px; }
}

/* ---- ৪. ইনপুটের লেখা ≥ ১৬ px: iOS Safari ফোকাসে জুম করে না ---- */
@media (max-width:991.98px), (pointer:coarse){
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]),
  select, textarea, .lg-in, .af-input, .dd-search, .pk-select, .pk-trig{
    font-size:max(var(--input-fs,16px), 1em) !important;
  }
}

/* ---- ৫. লোডিং ও ত্রুটির অবস্থা ---- */
[aria-busy="true"]{ cursor:progress; }
[aria-busy="true"] > *{ opacity:.72; }
.pb-error{
  display:flex; flex-direction:column; align-items:center; gap:12px; text-align:center;
  padding:20px 16px; margin:12px 0; border-radius:var(--radius-sm,12px);
  background:var(--surface,#fff); color:var(--text,#0f172a);
  border:1.5px solid var(--danger,#dc2626);
}
.pb-error p{ margin:0; font-weight:600; }
.pb-retry{
  min-height:var(--tap-min,44px); padding:10px 22px; border-radius:var(--radius-sm,12px);
  border:1px solid var(--primary-border,var(--primary,#4f46e5)); background:var(--grad,var(--primary,#4f46e5));
  color:var(--on-primary,#fff); font:inherit; font-weight:700; cursor:pointer;
}

/* ---- ৬. মোশন ও হাই-কনট্রাস্ট ---- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
}
@media (forced-colors:active){
  :where(a,button,input,select,textarea,[tabindex]):focus-visible{ outline:3px solid Highlight; }
  .skip-link{ border-color:CanvasText; }
}

/* ---- ৭. ধাপ ১৫-র বাকি কাজ: ইনপুটের বর্ডার ≥ 3:1 (--bd-input) ও মূল বাটনের সীমা (--primary-border) ---- */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]),
select, textarea, .lg-in, .af-input, .dd-search, .pk-select, .pk-trig, .track-box input, .form-group input{
  border-color:var(--bd-input,#7c849a);
}
.pk-on .ab-input{ border-color:var(--bd-input,#7c849a) !important; }
.pk-select:hover,.pk-trig:hover{ border-color:var(--primary,#4f46e5); }
.lg-btn,.ab-submit-btn,.pb-retry{ border:1px solid var(--primary-border,var(--primary,#4f46e5)); }
.pk-on .ab-submit-btn{ border:1px solid var(--primary-border,var(--primary,#4f46e5)); }