/* Logical properties throughout, so Urdu RTL and the four LTR reader languages share
   one stylesheet without a mirrored copy (rule 0.4). Tap targets are >= 44px because
   most readers are on cheap Android phones. */

.hn-box{border:1px solid rgba(0,0,0,.12);border-radius:10px;padding:16px;margin:20px 0;background:#fafafa}

.hn-badge{display:inline-block;margin:0 0 8px;padding:6px 12px;border-radius:999px;font-weight:700;font-size:14px;line-height:1.3}
.hn-papers--required .hn-badge{background:#fdecea;color:#8a1c12}
.hn-papers--not-required .hn-badge{background:#e8f5e9;color:#1b5e20}
.hn-papers--unknown .hn-badge{background:#fff4e5;color:#7a4a00}

.hn-hint{margin:8px 0 6px;font-size:14px;opacity:.85}
.hn-copyrow{display:flex;gap:8px;align-items:center;flex-wrap:wrap}

/* Local-language text is always LTR even inside the Urdu RTL page, and always starts
   from the reading edge of its own script. */
.hn-local{font-family:inherit}
code.hn-local{background:#fff;border:1px solid rgba(0,0,0,.15);border-radius:6px;padding:8px 10px;display:block;flex:1 1 260px;white-space:normal;direction:ltr;text-align:left}

.hn-apply__title{margin:0 0 12px;font-size:18px}
.hn-field{display:block;margin:0 0 12px}
.hn-field>span,.hn-field legend{display:block;margin-block-end:4px;font-weight:600;font-size:14px}
.hn-field input[type=text]{inline-size:100%;max-inline-size:420px;padding:10px;border:1px solid rgba(0,0,0,.2);border-radius:8px;font-size:16px}
.hn-field label{margin-inline-end:14px;font-size:15px;display:inline-block;min-block-size:32px;line-height:32px}
.hn-check{display:flex;gap:8px;align-items:flex-start}

textarea.hn-message{inline-size:100%;padding:12px;border:1px solid rgba(0,0,0,.2);border-radius:8px;font-size:15px;line-height:1.55;background:#fff;direction:ltr;text-align:left}

.hn-explain{font-size:14px;opacity:.85;margin:8px 0 0}
.hn-actions{display:flex;gap:8px;flex-wrap:wrap;margin-block-start:12px}
.hn-btn,.hn-copy{padding:12px 16px;border:0;border-radius:8px;background:#0c4a3e;color:#fff;font-size:15px;font-weight:600;cursor:pointer;min-block-size:44px}
.hn-copy{padding:10px 14px}
.hn-btn:hover,.hn-copy:hover{opacity:.9}
.hn-orig{margin:12px 0 0;font-size:14px}

@media (max-width:480px){
  .hn-actions .hn-btn{flex:1 1 100%}
}

/* The law reminder must not look like one of this employer's conditions. */
.hn-law{background:#eef4fb;border-color:#c3d7ee}
.hn-law__title{margin:0 0 6px;font-size:16px}
.hn-law__note{margin:0 0 10px;font-size:13px;opacity:.8}
.hn-law__body ul{margin:0;padding-inline-start:20px}
.hn-law__hub{margin:10px 0 0;font-size:14px}

/* The plugin's boxes carry their own dir (see hn_reader_dir_attrs), because the theme
   pins the whole page to rtl regardless of reader language. text-align:start then
   follows the box, not the page. */
.hn-box[dir="ltr"]{text-align:start}
.hn-box[dir="rtl"]{text-align:start}
.hn-box[dir="ltr"] .hn-field label,
.hn-box[dir="rtl"] .hn-field label{white-space:normal}

/* Spec 2.5 — the link from a listing into the pre-filled CV tool. Deliberately a link and
   not a fourth button: sending the message is the action this box is for, and making a CV
   is the next step afterwards, not a competing one. */
.hn-cv-link{margin:14px 0 0;font-size:15.5px}
.hn-cv-link a{font-weight:600;text-decoration:underline}

/* ---------------------------------------------------------- verify your adviser */
.hn-verify__lead{font-weight:600;font-size:17px;margin-block-end:18px}
.hn-verify h3{font-size:19px;margin-block:22px 10px}
.hn-verify__item{margin-block-end:16px;padding-inline-start:14px;border-inline-start:3px solid #d8dbdf}
.hn-verify__name{margin:0 0 4px;font-size:16.5px}
.hn-verify__item p{margin:0 0 6px}
.hn-verify__flags{margin:0;padding-inline-start:22px}
.hn-verify__flags li{margin-block-end:8px}
.hn-verify__fees{background:#fffbe9;border-inline-start:4px solid #e0b400;padding:12px 14px;border-radius:6px}

/* -------------------------------------------------------------- scam report form */
/* The honeypot.
   NOT `left:-9999px`: on the Urdu (RTL) page that pushed the document's scrollable width
   out by 9999px and the whole page panned sideways on a phone. Measured, not guessed.
   This is the clip technique instead — the field stays where it is, one pixel wide and
   clipped away, so it adds nothing to the scroll area. A bot still fills it in; a reader
   never sees it (aria-hidden, tabindex -1). */
.hn-hp{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.hn-scam__notice{background:#eef7ee;border-inline-start:4px solid #2e7d32;padding:12px 14px;
  border-radius:6px;font-weight:600}
.hn-scam__intro{background:#f6f7f9;padding:12px 14px;border-radius:6px}
.hn-scam .hn-field{display:block;margin-block-end:14px}
.hn-scam .hn-field > span{display:block;font-weight:600;margin-block-end:5px}
.hn-scam .hn-field small{display:block;margin-block-start:4px;color:#555;font-weight:400}
.hn-scam input[type=text],.hn-scam textarea,.hn-scam select{
  width:100%;padding:9px 11px;border:1px solid #ccd0d5;border-radius:6px;
  font-size:16px;background:#fff;box-sizing:border-box}
.hn-scam__money{display:grid;grid-template-columns:2fr 1fr;gap:12px}
@media (max-width:600px){ .hn-scam__money{grid-template-columns:1fr} }
.hn-verify-link{margin:12px 0 0;font-size:15.5px}
.hn-verify-link a{font-weight:600;text-decoration:underline}
.hn-verify__report{margin-block-start:26px;padding-block-start:16px;border-block-start:1px solid #d8dbdf;font-size:16px}
.hn-verify__report a{font-weight:600;text-decoration:underline}

/* ------------------------------------------------------------- Batch 4 articles */
.hn-article-intro{font-weight:600;font-size:17.5px}
.hn-article-box{margin-block:22px;padding:14px 16px;border-radius:6px;background:#f6f7f9;
  border-inline-start:4px solid #111}
.hn-article-box h3{margin:0 0 8px;font-size:18px}
.hn-article-box ul{margin:0;padding-inline-start:22px}
.hn-article-box li{margin-block-end:8px}
.hn-article-mistakes{background:#fffbe9;border-inline-start-color:#e0b400}
.hn-article-warning{background:#fdeeee;border-inline-start-color:#b3261e}
.hn-article-next{background:#eef7ee;border-inline-start-color:#2e7d32}
.hn-article-sources{background:#f2f4f7;border-inline-start-color:#5a6470;font-size:15px}
.hn-article-verified{margin:10px 0 0;color:#555;font-size:14.5px}

/* A phrase card is read in two directions at once: the Spanish/Italian/Portuguese line is
   always LTR even on the Urdu page, so it is isolated rather than left to the paragraph. */
.hn-phrase-card{margin-block-end:18px;padding:12px 14px;border:1px solid #d8dbdf;border-radius:6px}
.hn-phrase-card p{margin:0 0 4px}
.hn-phrase{direction:ltr;unicode-bidi:isolate;font-weight:600}
.hn-phrase-local{font-size:17px}
.hn-phrase-meaning{font-size:16px}
.hn-phrase-say{color:#555;font-size:15px}
.hn-phrase-reply-label{margin-block-start:10px !important;font-weight:600;font-size:14.5px;
  text-transform:uppercase;letter-spacing:.6px;color:#444}
.hn-payslip{width:100%;border-collapse:collapse;margin-block:14px}
.hn-payslip th,.hn-payslip td{border:1px solid #d8dbdf;padding:9px 11px;text-align:start;
  vertical-align:top;font-size:15.5px}
.hn-payslip th{width:38%;background:#f6f7f9;font-weight:600}
@media (max-width:600px){ .hn-payslip th{width:44%} }
.hn-route-cards{margin-block:10px}
.hn-route-card{padding:11px 13px;background:#f6f7f9;border-inline-start:4px solid #111;
  border-radius:6px;font-size:15.5px}
.hn-route-card a{font-weight:600;text-decoration:underline}

/* -------------------------------------------------------------- deadline tracker */
.hn-tracker__title{margin:0 0 8px;font-size:20px}
.hn-tracker__intro{background:#f6f7f9;padding:12px 14px;border-radius:6px}
.hn-tracker .hn-field{display:block;margin-block-end:14px}
.hn-tracker .hn-field > span{display:block;font-weight:600;margin-block-end:5px}
.hn-tracker .hn-field small{display:block;margin-block-start:5px;color:#555;font-weight:400;font-size:14.5px}
.hn-tracker input[type=date],.hn-tracker input[type=number],.hn-tracker select{
  width:100%;padding:9px 11px;border:1px solid #ccd0d5;border-radius:6px;font-size:16px;
  background:#fff;box-sizing:border-box}
.hn-tracker .hn-check{display:flex;align-items:flex-start;gap:9px}
.hn-tracker .hn-check input{margin-block-start:4px;transform:scale(1.2)}
.hn-tracker__verify{color:#8a6d00 !important}
.hn-tracker__mech{margin:-8px 0 14px;color:#444;font-size:15px}
.hn-tracker__status{min-height:1.4em;color:#555;font-size:14.5px}
.hn-tracker__key{background:#eef7ee;border-inline-start:4px solid #2e7d32;padding:12px 14px;
  border-radius:6px;font-size:17px}
.hn-tracker__gapwarn{background:#fffbe9;border-inline-start:4px solid #e0b400;padding:12px 14px;
  border-radius:6px}
.hn-tracker__phase{margin-block:16px;padding-inline-start:14px;border-inline-start:3px solid #d8dbdf}
.hn-tracker__phase h4{margin:0 0 6px;font-size:16.5px}
.hn-tracker__phase.is-past{opacity:.62}
.hn-tracker__phase ul{margin:0;padding-inline-start:22px}
.hn-tracker__phase li{margin-block-end:6px}
/* A date is Latin digits inside Urdu text; isolate it so the surrounding RTL run cannot
   reorder it. Same reason as the phrase spans. */
.hn-tracker__date,.hn-tracker__rel{direction:ltr;unicode-bidi:isolate}
.hn-tracker__rel{color:#555;font-size:14.5px}
.hn-tracker__clocks-h{margin-block:22px 8px;font-size:17px}
.hn-tracker__clock{margin-block-end:12px;padding-inline-start:14px;border-inline-start:3px solid #d8dbdf}
.hn-tracker__clock p{margin:0 0 4px}
.hn-tracker__after{background:#f6f7f9;padding:12px 14px;border-radius:6px}
.hn-tracker__privacy{color:#555;font-size:14.5px;margin-block-start:14px}

/* ------------------------------------------------------------------ origin notes */
.hn-origin__intro{background:#f6f7f9;padding:12px 14px;border-radius:6px}
.hn-origin .hn-field{display:block;margin-block-end:16px}
.hn-origin .hn-field > span{display:block;font-weight:600;margin-block-end:5px}
.hn-origin select{width:100%;padding:9px 11px;border:1px solid #ccd0d5;border-radius:6px;
  font-size:16px;background:#fff;box-sizing:border-box}
.hn-origin__panel h4{margin-block:20px 6px;font-size:17px}
.hn-origin__panel p{margin:0 0 10px}
.hn-tracker__origin-note{margin-block-start:10px;padding:11px 13px;background:#fffbe9;
  border-inline-start:4px solid #e0b400;border-radius:6px;font-size:15.5px}
.hn-tracker__origin-note p{margin:0 0 6px}
.hn-tracker__origin-note p:last-child{margin:0}