/* 2Lúa v2.4.12 — device-aware layout fixes.
 * Desktop ≥1200 CSS px with precise pointer uses the original left dock.
 * Tablet 820–1199 and large touch tablets in landscape use the five-tab bar.
 * Phones and narrow tablets <=819 retain their tested mobile styles.
 * Load last, after layout-unified.css and tablet-navigation.css.
 */

/* All tablets using the mobile navigation, including iPad Pro / Surface landscape
   when the active primary input is coarse touch. */
@media (min-width:820px) and (max-width:1199px),
       (min-width:1200px) and (max-width:1450px) and (hover:none) and (pointer:coarse) {
  /* A legacy @media in v2-home.css accidentally re-enables the search form
     between 821 and 1120px; hide it for the complete tablet experience. */
  .tl-v2-header-search,
  .tl-reference-home .tl-v2-header-search,
  .tl-topbar form.tl-v2-header-search { display:none !important; }

  .tl-app .tl-side-dock,
  .tl-side-dock,
  .tl-tablet-rail,
  .tl-desktop-nav,
  .tl-reference-home .tl-desktop-nav { display:none !important; }

  .tl-bottom-nav--shared {
    display:grid !important;
    position:fixed !important;
    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    width:100% !important;
    max-width:100vw !important;
    grid-template-columns:repeat(5,minmax(0,130px));
    justify-content:center;
    z-index:120 !important;
    padding:7px max(12px,env(safe-area-inset-right)) calc(7px + env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));
    background:var(--tl-card,#fff);
    border-top:1px solid var(--tl-border,#dce7df);
    box-shadow:0 -10px 28px rgba(22,55,32,.08);
  }
  .tl-bottom-nav--shared > a,
  .tl-bottom-nav--shared > button {
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    gap:2px; min-width:0; min-height:54px; padding:0 6px;
    background:transparent; border:0; color:var(--tl-muted,#667c70);
    text-decoration:none; font:inherit; touch-action:manipulation;
  }
  .tl-bottom-nav--shared a > span,
  .tl-bottom-nav--shared button > span {font-size:21px;line-height:1.15}
  .tl-bottom-nav--shared a > small,
  .tl-bottom-nav--shared button > small {font-size:11px;line-height:1.25;font-weight:650}
  .tl-bottom-nav--shared .tl-bottom-ai > span {
    display:grid;place-items:center;width:42px;height:42px;margin-top:-16px;
    border:4px solid var(--tl-card,#fff);border-radius:50%;
    background:var(--tl-accent,#087a4a);color:#fff;
  }
  .tl-bottom-nav--shared :is(a,button).is-active {color:var(--tl-accent,#087a4a);font-weight:750}
  .tl-quick-menu {align-items:end !important;z-index:180 !important}
  .tl-quick-menu__panel {width:min(100%,660px);max-height:min(86dvh,800px);border-radius:26px 26px 0 0}
  body {padding-bottom:calc(78px + env(safe-area-inset-bottom))}

  /* Full tablet content width: remove left-dock compensation from every route. */
  .tl-app .tl-v2-main,
  .tl-app .tl-workspace-layout,
  .tl-app .tl-policy-wrap,
  .tl-app.tl-policy-page--legal > .tl-policy-wrap,
  .tl-app .tl-contact-wrap,
  .tl-app .tl-news-page,
  .tl-app .tl-article-shell,
  .tl-app .tl-account-wrap,
  .tl-app .tl-profile-wrap,
  .tl-app .tl-social-layout,
  .tl-app .tl-farmer-console__inner,
  .tl-site-footer .tl-footer-grid,
  .tl-site-footer .tl-footer-bottom {
    box-sizing:border-box;
    width:min(calc(100% - 40px),1200px) !important;
    max-width:1200px !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
  .tl-app .tl-workspace-layout{display:block}
  .tl-app .tl-workspace-main{width:100%;min-width:0}
  .tl-site-footer {padding-bottom:calc(14px + env(safe-area-inset-bottom))}

  /* Tablet hero: stop compressing copy next to a narrow weather widget.
     Put the weather information on its own row, keep the farmer in sight. */
  .tl-app.tl-reference-home .tl-v2-hero {
    display:grid;
    grid-template-columns:minmax(0,1fr);
    align-items:start;
    gap:14px;
    margin:0 !important;
    min-height:0;
    padding:30px clamp(22px,3.2vw,44px) 22px !important;
    border-radius:0;
    overflow:hidden;
  }
  .tl-reference-home .tl-v2-hero-art {
    width:38%;height:320px;max-height:55%;top:0;bottom:auto;
    mask-image:linear-gradient(90deg,#000 57%,transparent 100%);
    -webkit-mask-image:linear-gradient(90deg,#000 57%,transparent 100%);
  }
  .tl-reference-home .tl-v2-hero-copy {
    box-sizing:border-box;
    grid-column:1;
    width:auto;
    max-width:610px;
    min-width:0;
    margin-left:clamp(215px,36%,390px) !important;
    padding:7px 0 8px;
  }
  .tl-reference-home .tl-v2-eyebrow {
    margin:0 0 15px 4px;
    font-size:clamp(12px,1.25vw,15px);
    transform:none;
  }
  .tl-reference-home .tl-v2-hero h1 {
    font-size:clamp(28px,3.2vw,40px);
    line-height:1.2;
    overflow-wrap:normal;
  }
  .tl-reference-home .tl-v2-hero-copy > p {
    font-size:clamp(12px,1.24vw,14px);
    line-height:1.6;
  }
  .tl-reference-home .tl-v2-weather-card {
    grid-column:1;
    justify-self:end;
    width:min(100%,620px);
    max-width:620px;
    min-width:0;
    margin:12px 0 0;
    padding:15px;
  }
  .tl-reference-home .tl-v2-trust {
    position:relative;
    grid-column:1;
    left:auto;right:auto;bottom:auto;
    width:100%;min-width:0;max-width:none;
    height:auto;min-height:60px;
    margin-top:6px;
    padding:7px 8px;
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
  .tl-reference-home .tl-v2-trust > span {padding-left:5px;min-width:0;grid-template-columns:32px minmax(0,1fr)}
  .tl-reference-home .tl-v2-trust b {font-size:11px;white-space:normal;line-height:1.25}
  .tl-reference-home .tl-v2-trust small {font-size:9px;white-space:normal;line-height:1.25}
  .tl-v2-weather-topline{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr)}
  .tl-v2-weather-live{min-width:0}
  .tl-v2-weather-live strong{font-size:clamp(30px,3.1vw,42px)}
  .tl-v2-weather-stats{min-width:0;overflow-wrap:anywhere}
  .tl-v2-weather-stats span{min-width:0}

  /* Price cards should stay readable; swipe instead of fitting 7–8 on a row. */
  .tl-reference-home .tl-v2-price-grid,
  .tl-reference-home .tl-v2-input-grid {
    display:flex !important;
    flex-wrap:nowrap;
    gap:12px;
    overflow-x:auto;
    overflow-y:hidden;
    padding:4px 2px 13px;
    scroll-snap-type:x proximity;
    overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:thin;
    grid-template-columns:none !important;
  }
  .tl-reference-home .tl-v2-price-grid > .tl-v2-product,
  .tl-reference-home .tl-v2-input-grid > .tl-v2-product {
    display:flex !important;
    flex:0 0 clamp(170px,22vw,210px);
    min-width:0;
    scroll-snap-align:start;
  }
  .tl-reference-home .tl-v2-price-grid > .tl-v2-price-empty,
  .tl-reference-home .tl-v2-input-grid > .tl-v2-price-empty,
  .tl-reference-home .tl-v2-price-grid > .tl-v2-empty {flex:1 0 100%;}
  .tl-reference-home .tl-v2-input-layout {grid-template-columns:minmax(0,1fr)}
  .tl-reference-home .tl-v2-market-sidebar {margin-top:10px;min-width:0}
  .tl-reference-home .tl-v2-section-head {flex-wrap:wrap;gap:12px}
  .tl-reference-home .tl-v2-section-head .tl-v2-heading {flex:1 1 310px;min-width:0}
  .tl-reference-home .tl-v2-tabs {max-width:100%;overflow-x:auto;flex-wrap:nowrap;scrollbar-width:thin}
  .tl-reference-home .tl-v2-tabs button {flex:0 0 auto;white-space:nowrap}
  .tl-reference-home .tl-v2-chart-grid {grid-template-columns:repeat(2,minmax(0,1fr))}
  .tl-reference-home .tl-v2-chart-grid > .tl-v2-panel:last-child {grid-column:1 / -1}
  .tl-reference-home .tl-v2-end-grid {grid-template-columns:minmax(0,1fr)}
  .tl-reference-home .tl-v2-news-grid {grid-template-columns:repeat(3,minmax(0,1fr))}
  .tl-reference-home .tl-v2-cta{min-height:230px}
}

/* Tablet portrait: don't constrain the page to a phone-width column. */
@media (min-width:768px) and (max-width:819px) {
  .tl-topbar .tl-v2-header-search {display:none !important}
  .tl-reference-home .tl-v2-hero {margin-inline:0 !important}
  .tl-reference-home .tl-v2-weather-card {width:100%}
  .tl-reference-home .tl-v2-trust {min-width:0}
}

/* Small phones: no layout rule above should change the existing 5-tab UX. */
@media (max-width:767px) {
  .tl-topbar .tl-v2-header-search {display:none !important}
}

/* 2Lúa v2.4.17 — OAuth identity providers; phone OTP UI removed. */
.tl-login-panel .tl-auth-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))!important}
.tl-social-providers{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:11px}
.tl-social-provider{display:flex;align-items:center;justify-content:center;gap:9px;min-width:0;min-height:46px;padding:9px 11px;border:1px solid #d4ded8;border-radius:13px;background:#fff;color:#183b30;font-size:12px;font-weight:750;text-decoration:none;text-align:center;cursor:pointer;box-sizing:border-box}
.tl-social-provider:hover:not(:disabled){background:#f3fbf5;border-color:#25875b;text-decoration:none}
.tl-social-provider:focus-visible{outline:3px solid #6fcf9a;outline-offset:2px}
.tl-social-provider:disabled{opacity:.55;cursor:not-allowed}
.tl-provider-g{font-size:22px;font-weight:800;color:#4285f4}
.tl-provider-f{width:25px;height:25px;display:grid;place-items:center;border-radius:7px;background:#1877f2;color:#fff;font-family:Arial,sans-serif;font-size:21px;font-weight:900}
@media(max-width:500px){.tl-social-providers{grid-template-columns:1fr;gap:8px}.tl-social-provider{min-height:45px}.tl-login-panel .tl-auth-tabs{grid-template-columns:repeat(2,minmax(0,1fr))!important}}