/* ==========================================================================
   Orna (ওড়না, "dupatta"): original Pakistani designer wear, in Bangladesh, with proof.

   Rule taken from the brands themselves (Sapphire, Khaadi, Élan, Maria B, Sana
   Safinaz all run #fff + black): the shell is quiet and the clothes carry every
   colour. So there's no brand-coloured UI. Two inks from the subject's world:
     kajal: the near-black of kohl, a touch violet so it never reads as grey.
     alta: the red dye on a bride's feet. Price cuts and deadlines only.
   Proof is marked by the brand's woven label, drawn as a label, not by a colour.
   Serif lives only in the wordmark and collection names, as it does on Élan.
   ========================================================================== */

:root{
  --paper:#FFFFFF;
  --paper-2:#F6F5F4;      /* image tiles before load, sunk panels */
  --paper-3:#EEECEB;
  --line:#E5E2E1;
  --line-2:#CFCACA;

  --kajal:#17131A;        /* 18.3:1 on paper */
  --kajal-2:#4A4450;
  --kajal-3:#6A6470;      /* 5.7:1 on paper; #8A8490 was 3.6:1 and failed AA for small text */
  --on-kajal:#FBFAFA;

  --alta:#B01733;         /* 7.0:1 on paper; #D8324F was 4.7:1, too thin a margin for 11.5px sale pills */
  --alta-wash:#FBE9EC;
  --on-alta:#FFFFFF;

  /* in Dhaka now: ships tomorrow. Muted green of a banana leaf, used on one chip. */
  --leaf:#2F6A3F;         /* 6.5:1 on paper, 5.5:1 on --leaf-wash */
  --leaf-wash:#E5F0E7;
  /* pre-order: on its way from Lahore. Indigo of a customs stamp. */
  --stamp:#3A4A8C;        /* 8.3:1 on paper, 7.0:1 on --stamp-wash */
  --stamp-wash:#E8EBF6;
  --on-stamp:#FFFFFF;
  --on-leaf:#FFFFFF;
  /* edge of inputs, checkboxes and selects: 3:1 against paper (1.4.11); --line-2 was 1.6:1 */
  --control-edge:#8A8490;

  /* the woven label. Proof records are drawn as the brand's sewn-in tag. */
  --label:#F3F1EC;
  --label-weave:rgba(23,19,26,.045);
  --label-edge:#D9D3C8;
  --zari:#80621C;         /* metallic thread on the label; 5.1:1 on --label */

  --bkash:#D1266B; --nagad:#B8401C;   /* #E4552C was 3.7:1 under white 11px text */

  --r-1:2px; --r-2:4px; --r-3:10px; --r-4:18px; --r-5:999px;  /* fashion runs square; round only for chips and sheets */

  --sh-1:0 1px 1px rgba(23,19,26,.04), 0 2px 8px -4px rgba(23,19,26,.14);
  --sh-2:0 1px 2px rgba(23,19,26,.06), 0 18px 36px -20px rgba(23,19,26,.40);
  --sh-3:0 2px 4px rgba(23,19,26,.06), 0 36px 70px -30px rgba(23,19,26,.55);

  /* Latin sets in its face, Bangla falls through to its own face in the same stack. */
  --display:'Bodoni Moda','Tiro Bangla',Didot,'Times New Roman',serif;
  --display-bn:'Tiro Bangla','Bodoni Moda',serif;
  --ui:'Instrument Sans','Noto Sans Bengali','Helvetica Neue',system-ui,sans-serif;
  --mono:'DM Mono','Noto Sans Bengali',ui-monospace,Menlo,monospace;

  /* type scale: 1.2 minor third off 15px, fractional on purpose */
  --t-xs:11.5px; --t-s:13px; --t-m:15px; --t-l:18px; --t-xl:21.6px; --t-2xl:26px; --t-3xl:37.3px; --t-4xl:clamp(40px,6.4vw,76px);

  --ease:cubic-bezier(.2,.7,.2,1);
  --gutter:clamp(16px,3.4vw,44px);
  --maxw:1320px;
  color-scheme:light;
}

/* Photography leads, so dark mode keeps the clothes on a near-black ground,
   the way Sapphire's campaign pages sit on dark damask. */
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --on-alta:#110E13; --on-stamp:#110E13; --on-leaf:#110E13; --control-edge:#6A6470;   /* light tints in dark mode take dark text: 7.8:1 and 9.2:1 */
    --paper:#0E0C10; --paper-2:#17141A; --paper-3:#1F1B22; --line:#2A252E; --line-2:#3B3440;
    --kajal:#F1EEF2; --kajal-2:#BDB6C2; --kajal-3:#9A93A0; --on-kajal:#110E13;
    --alta:#FF7A8E; --alta-wash:#3A1720;
    --leaf:#86C897; --leaf-wash:#17291C; --stamp:#9FB0F0; --stamp-wash:#1B2140;
    --label:#1D1A20; --label-weave:rgba(255,255,255,.035); --label-edge:#3A3440; --zari:#D8B45E;
    --sh-1:0 1px 1px rgba(0,0,0,.4), 0 2px 8px -4px rgba(0,0,0,.7);
    --sh-2:0 1px 2px rgba(0,0,0,.5), 0 18px 36px -20px rgba(0,0,0,.9);
    --sh-3:0 2px 4px rgba(0,0,0,.5), 0 36px 70px -30px rgba(0,0,0,1);
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
    --on-alta:#110E13; --on-stamp:#110E13; --on-leaf:#110E13; --control-edge:#6A6470;   /* light tints in dark mode take dark text: 7.8:1 and 9.2:1 */
  --paper:#0E0C10; --paper-2:#17141A; --paper-3:#1F1B22; --line:#2A252E; --line-2:#3B3440;
  --kajal:#F1EEF2; --kajal-2:#BDB6C2; --kajal-3:#9A93A0; --on-kajal:#110E13;
  --alta:#FF7A8E; --alta-wash:#3A1720;
  --leaf:#86C897; --leaf-wash:#17291C; --stamp:#9FB0F0; --stamp-wash:#1B2140;
  --label:#1D1A20; --label-weave:rgba(255,255,255,.035); --label-edge:#3A3440; --zari:#D8B45E;
  --sh-1:0 1px 1px rgba(0,0,0,.4), 0 2px 8px -4px rgba(0,0,0,.7);
  --sh-2:0 1px 2px rgba(0,0,0,.5), 0 18px 36px -20px rgba(0,0,0,.9);
  --sh-3:0 2px 4px rgba(0,0,0,.5), 0 36px 70px -30px rgba(0,0,0,1);
  color-scheme:dark;
}

/* Print is always light, whatever theme the screen is in. */
@media print{:root,:root[data-theme="dark"]{--paper:#fff;--paper-2:#fff;--paper-3:#f2f2f2;--line:#ccc;--line-2:#999;--kajal:#000;--kajal-2:#222;--kajal-3:#444;--on-kajal:#fff;color-scheme:light}}
