/* Compact dropdown 1 values from design/meds.html and design/docs.html. */
:is(#medta,#docta).picker-host { position:relative; min-width:0; }
:is(#medta,#docta).picker-host > :is(.input-icon,.pop,.picker-engine) { display:none!important; }
:is(#medta,#docta).picker-host .picker-trigger { display:flex; align-items:center; justify-content:space-between; gap:10px; width:100%; height:52px; border:2px solid #c7d6ef; border-radius:10px; background:#fff; color:#0F2447; padding:0 16px; font:600 15px/1.3 "Open Sans",Arial,sans-serif; text-align:left; cursor:pointer; }
:is(#medta,#docta).picker-host .picker-trigger::after { content:""; width:8px; height:8px; border-right:2px solid #2A6BD6; border-bottom:2px solid #2A6BD6; transform:rotate(45deg); flex:none; margin-top:-4px; }
:is(#medta,#docta).picker-host .picker-trigger[aria-expanded=true] { border-color:#2A6BD6; box-shadow:0 0 0 3px #EAF2FC; }
:is(#medta,#docta).picker-host .picker-trigger-label { flex:1; min-width:0; }
:is(#medta,#docta).picker-host .picker-trigger-icon, :is(#medta,#docta) .picker-panel .picker-search-icon { display:inline-flex; align-items:center; flex:none; color:#2A6BD6; }
:is(#medta,#docta) .picker-panel { position:fixed; inset:auto; z-index:60; display:flex; flex-direction:column; width:820px; max-width:calc(100vw - 32px); max-height:min(560px,calc(100vh - 32px)); max-height:min(560px,calc(100dvh - 32px)); box-sizing:border-box; overflow:hidden; padding:16px 18px 18px; border:1px solid #dfe6f0; border-radius:14px; background:#fff; color:#0F2447; box-shadow:0 18px 48px rgba(15,36,71,.18); font:400 15px/1.5 "Open Sans",Arial,sans-serif; }
:is(#medta,#docta) .picker-panel *, :is(#medta,#docta) .picker-panel *::before, :is(#medta,#docta) .picker-panel *::after { box-sizing:border-box; }
:is(#medta,#docta) .picker-panel [hidden], :is(#medta,#docta) .picker-panel[hidden] { display:none!important; }
:is(#medta,#docta) .picker-panel .srch { display:flex; align-items:center; gap:10px; min-height:52px; flex:none; border:2px solid #2A6BD6; border-radius:10px; padding:0 14px; box-shadow:0 0 0 3px #EAF2FC; }
:is(#medta,#docta) .picker-panel .srch input { min-width:0; width:100%; height:48px; min-height:0; border:0; outline:0; border-radius:8px; padding:0; box-shadow:none; background:#fff; color:#0F2447; font:600 17px "Open Sans",Arial,sans-serif; }
:is(#medta,#docta) .picker-panel .srch input::placeholder { color:#8a94a6; font-weight:400; }
:is(#medta,#docta) .picker-panel .picker-count { font-size:13px; color:#5f6e84; white-space:nowrap; }
:is(#medta,#docta) .picker-panel .picker-scroll { min-height:0; overflow-y:auto; overflow-x:hidden; overscroll-behavior:contain; flex:1 1 auto; padding:0 2px; }
:is(#medta,#docta) .picker-panel .hint { font-size:13px; color:#5f6e84; margin:8px 2px 10px; }
:is(#medta,#docta) .picker-panel .picker-note { margin:0 0 10px; padding:9px 12px; border-radius:9px; background:#FFF4DB; color:#9a5b00; font-size:13px; }
:is(#medta,#docta) .picker-panel .hit { display:flex; align-items:center; flex-wrap:wrap; gap:12px; border:1px solid #dfe6f0; border-radius:10px; padding:8px 12px; margin-bottom:6px; background:#fff; }
:is(#medta,#docta) .picker-panel .hit:hover, :is(#medta,#docta) .picker-panel .hit.active { border-color:#2A6BD6; }
:is(#medta,#docta) .picker-panel .grow { flex:1 1 180px; min-width:0; overflow-wrap:anywhere; }
:is(#medta,#docta) .picker-panel .nm { display:block; font:700 15px/1.5 "Open Sans",Arial,sans-serif; }
:is(#medta,#docta) .picker-panel .sub { font-size:13px; color:#5f6e84; }
:is(#medta,#docta) .picker-panel .kind { display:inline-flex; align-items:center; min-height:22px; font:800 10px "Montserrat",Arial,sans-serif; letter-spacing:.06em; text-transform:uppercase; border-radius:5px; padding:3px 7px; background:#EEF1F5; color:#4b5a70; margin-left:8px; vertical-align:middle; }
:is(#medta,#docta) .picker-panel .kind.brand { background:#FBF1CF; color:#7a5a00; }
:is(#medta,#docta) .picker-panel .kind.in { background:#E8F5EC; color:#1B7A3D; margin:4px 0 0; }
:is(#medta,#docta) .picker-panel .add { height:40px; padding:0 14px; border:2px solid #2A6BD6; border-radius:8px; font:800 14px "Montserrat",Arial,sans-serif; color:#1F54AC; background:#fff; cursor:pointer; white-space:nowrap; margin-left:auto; }
:is(#medta,#docta) .picker-panel .add:hover { background:#2A6BD6; color:#fff; }
:is(#medta,#docta) .picker-panel .strength-picker { position:relative; max-width:100%; }
:is(#medta,#docta) .picker-panel .strength { min-height:36px; border:2px solid #c7d6ef; border-radius:8px; padding:4px 10px; background:#fff; color:#1F54AC; font:700 13px "Open Sans",Arial,sans-serif; cursor:pointer; max-width:100%; }
:is(#medta,#docta) .picker-panel .strength::after { content:""; display:inline-block; width:7px; height:7px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(45deg); margin:0 2px 3px 10px; }
:is(#medta,#docta) .picker-panel .strength-options { position:relative; z-index:1; min-width:120px; max-width:100%; max-height:180px; overflow:auto; margin-top:6px; padding:4px; background:#fff; border:2px solid #2A6BD6; border-radius:8px; }
:is(#medta,#docta) .picker-panel .strength-options button { display:block; width:100%; min-height:36px; border:0; border-radius:5px; padding:6px 10px; text-align:left; font:600 13px "Open Sans",Arial,sans-serif; background:#fff; color:#0F2447; cursor:pointer; }
:is(#medta,#docta) .picker-panel .strength-options button[aria-selected=true], :is(#medta,#docta) .picker-panel .strength-options button:hover { background:#EAF2FC; color:#1F54AC; }
:is(#medta,#docta) .picker-panel .rxc { display:inline-flex; align-items:center; gap:7px; min-height:30px; height:auto; max-width:100%; padding:4px 9px 4px 7px; border-radius:7px; background:#E8F5EC; border:1px solid #bfe3c9; color:#1B7A3D; white-space:normal; flex:0 1 250px; font:800 12px/1.4 "Montserrat",Arial,sans-serif; }
:is(#medta,#docta) .picker-panel .rxc.no { background:#f1f4f8; border-color:#dfe6f0; color:#4b5a70; }
:is(#medta,#docta) .picker-panel .rxc.warning { background:#f1f4f8; border-color:#dfe6f0; color:#33415C; }   /* Victor 4:22 PM Oct 27: no yellow */
:is(#medta,#docta) .picker-panel .rxc .rxc-sub { display:block; margin-top:2px; font:600 11.5px/1.35 "Open Sans",Arial,sans-serif; color:#5B6B86; white-space:normal; }
:is(#medta,#docta) .picker-panel .picker-brand { display:inline-flex; align-items:center; gap:7px; flex:none; }
:is(#medta,#docta) .picker-panel .picker-brand img { height:16px; width:auto; }
:is(#medta,#docta) .picker-panel .picker-brand b { font:800 12px "Montserrat",Arial,sans-serif; color:#2A6BD6; border-left:1.5px solid #2A6BD6; padding-left:6px; }
:is(#medta,#docta) .picker-panel .picker-badge { min-width:0; overflow-wrap:anywhere; }
:is(#medta,#docta) .picker-panel .rx-badge { display:block; padding:0; background:transparent; color:inherit; font:inherit; }
:is(#medta,#docta) .picker-panel .rx-badge small { display:block; font:600 11px/1.4 "Open Sans",Arial,sans-serif; color:#5f6e84; }
:is(#medta,#docta) .picker-panel .picked { margin-top:14px; border-top:1px solid #dfe6f0; padding-top:12px; }
:is(#medta,#docta) .picker-panel .ph { margin-bottom:8px; }
:is(#medta,#docta) .picker-panel .ph b { font:800 13px "Montserrat",Arial,sans-serif; }
:is(#medta,#docta) .picker-panel .row { display:flex; flex-wrap:wrap; gap:10px; align-items:center; min-height:46px; border:2px solid #dfe6f0; border-radius:9px; padding:6px 10px 6px 14px; margin-bottom:6px; font-weight:600; font-size:14px; background:#fff; }
:is(#medta,#docta) .picker-panel .row > :is(details,.picker-name) { flex:1 1 180px; min-width:0; overflow-wrap:anywhere; }
:is(#medta,#docta) #doc-picker .row { flex-wrap:nowrap; align-items:flex-start; border:1px solid var(--line); border-radius:10px; padding:12px 14px; margin-bottom:8px; }
:is(#medta,#docta) #doc-picker .picker-name b { display:inline; font-weight:700; }
:is(#medta,#docta) #doc-picker .picker-name .sub { display:block; font-size:13px; font-weight:400; color:#5f6e84; }
:is(#medta,#docta) .picker-panel .row summary { cursor:pointer; }
:is(#medta,#docta) .picker-panel .medicine-options { position:static; min-width:0; padding:8px 0; font-size:13px; }
:is(#medta,#docta) .picker-panel .medicine-options input { max-width:100%; border-radius:6px; }
:is(#medta,#docta) .picker-panel .x { color:#8a94a6; background:transparent; border:0; border-radius:6px; cursor:pointer; font-size:18px; line-height:1; padding:6px; min-height:36px; min-width:36px; margin-left:auto; }
:is(#medta,#docta) .picker-panel .x:hover { color:#b42318; }
:is(#medta,#docta) .picker-panel .foot { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:12px; flex:none; }
:is(#medta,#docta) .picker-panel .foot > span { font-size:13px; color:#5f6e84; }
:is(#medta,#docta) .picker-panel .done { height:44px; border:2px solid #2A6BD6; border-radius:10px; padding:0 18px; background:#2A6BD6; color:#fff; cursor:pointer; font:700 14px "Montserrat",Arial,sans-serif; }
:is(#medta,#docta) .picker-panel :is(button,summary):focus-visible, :is(#medta,#docta) .picker-trigger:focus-visible { outline:2px solid #2A6BD6; outline-offset:2px; }
@media(max-width:600px) {
  :is(#medta,#docta) .picker-panel { padding:12px; }
  :is(#medta,#docta) .picker-panel .srch { display:grid; grid-template-columns:18px minmax(0,1fr); column-gap:10px; row-gap:0; padding:0 10px 6px; }
  :is(#medta,#docta) .picker-panel .srch input { flex:1 1 100%; font-size:16px; }
  :is(#medta,#docta) .picker-panel .picker-count { font-size:12px; grid-column:2; }
  :is(#medta,#docta) .picker-panel .grow { flex-basis:100%; }
  :is(#medta,#docta) .picker-panel .rxc { flex-basis:auto; }
  :is(#medta,#docta) .picker-panel .row > :is(details,.picker-name) { flex-basis:calc(100% - 50px); }
}

/* Most prescribed list in the empty medicine dropdown (Victor 1:04 PM Oct 27). Rounded rectangles, never pills. */
:is(#medta,#docta) #med-picker .popular { padding:4px 0 6px; }
:is(#medta,#docta) #med-picker .popular-h { font:700 12px/1.3 "Open Sans",Arial,sans-serif; letter-spacing:.06em; text-transform:uppercase; color:#5B6B86; margin:6px 0 10px; }
:is(#medta,#docta) #med-picker .popular-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
:is(#medta,#docta) #med-picker .popular-b { display:flex; align-items:center; min-height:42px; padding:8px 12px; border:1px solid #D5E1F2; border-radius:8px; background:#fff; color:#0F2447; font:600 14px/1.25 "Open Sans",Arial,sans-serif; text-align:left; cursor:pointer; }
:is(#medta,#docta) #med-picker .popular-b:hover { border-color:#2A6BD6; background:#F5F9FF; }
:is(#medta,#docta) #med-picker .popular-b:focus-visible { outline:2px solid #2A6BD6; outline-offset:2px; }
@media (max-width:700px) { :is(#medta,#docta) #med-picker .popular-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }

/* Added medicines with three prices (Victor 1:58 PM Oct 27) */
:is(#medta,#docta) #med-picker .picked { margin:6px 0 14px; padding:12px 14px; border:1px solid #D5E1F2; border-radius:12px; background:#F7FAFE; }
:is(#medta,#docta) #med-picker .picked .ph b { font:700 12px/1.3 "Open Sans",Arial,sans-serif; letter-spacing:.06em; text-transform:uppercase; color:#0F2447; }
:is(#medta,#docta) #med-picker .mp3 { flex:1 0 100%; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:8px; }
:is(#medta,#docta) #med-picker .mp3 .c { padding:8px 10px; border:1px solid #E3EAF4; border-radius:8px; background:#fff; }
:is(#medta,#docta) #med-picker .mp3 .k { display:block; font:600 11px/1.3 "Open Sans",Arial,sans-serif; letter-spacing:.04em; text-transform:uppercase; color:#5B6B86; margin-top:2px; }
:is(#medta,#docta) #med-picker .mp3 b { font:700 14px/1.35 "Open Sans",Arial,sans-serif; color:#0F2447; }
@media (max-width:700px) { :is(#medta,#docta) #med-picker .mp3 { grid-template-columns:1fr; } }
:is(#medta,#docta) #med-picker .picked .row { flex-wrap:wrap; }
:is(#medta,#docta).picker-host .picker-trigger::after { transition:transform .15s; }
:is(#medta,#docta).picker-host .picker-trigger[aria-expanded=true]::after { transform:rotate(-135deg); margin-top:4px; }   /* points up while open (Victor 2:50 PM Oct 27) */
@media (prefers-reduced-motion:reduce) { :is(#medta,#docta).picker-host .picker-trigger::after { transition:none; } }

:is(#medta,#docta) #doc-picker .doctor-specialty { color:#5f6e84; font-weight:400; }
:is(#medta,#docta) #doc-picker .doctor-accepting { display:inline-flex; align-items:center; gap:4px; }
:is(#medta,#docta) #doc-picker .doctor-accepting.yes { color:#1B7A3D; }
:is(#medta,#docta) #doc-picker .doctor-accepting.no { color:#b42318; }
:is(#medta,#docta) #doc-picker .x { flex:none; align-self:flex-start; }