/* Gematrixx date calculator responsive repair v1 — isolated from global rules */
#pageDatecalc,
#pageDatecalc .dtl-shell,
#pageDatecalc .dtl-legacy-wrap,
#pageDatecalc .dc-container{width:100%;max-width:100%;min-width:0;box-sizing:border-box}
#pageDatecalc .dtl-legacy-wrap{overflow:hidden}
#pageDatecalc .dc-container{padding-inline:clamp(.55rem,2.5vw,1.5rem)}
#pageDatecalc .dc-dates{align-items:stretch}
#pageDatecalc .dc-date-box{min-width:0;box-sizing:border-box}
#pageDatecalc .dc-fields{min-width:0}
#pageDatecalc .dc-fields>div{min-width:0}
#pageDatecalc .dc-fields input{max-width:100%;box-sizing:border-box}
#pageDatecalc .dc-duration-row>*{min-width:0;box-sizing:border-box}
#pageDatecalc .dc-main-duration{max-width:100%;white-space:normal;overflow-wrap:anywhere}
#pageDatecalc .dc-from-to{overflow-wrap:anywhere}
#pageDatecalc .dc-section{max-width:100%;overflow:hidden}
#pageDatecalc .dc-results{max-width:100%;box-sizing:border-box}
#pageDatecalc .dc-pair{min-width:0;max-width:100%;box-sizing:border-box}
#pageDatecalc .dc-col-e,#pageDatecalc .dc-col-v{min-width:0;overflow-wrap:anywhere}
#pageDatecalc .dc-months-dialog{max-width:calc(100vw - 20px);max-height:calc(100vh - 20px);overflow:auto}
#pageDatecalc .dc-months-grid,#pageDatecalc .dc-month-list{min-width:0}
#pageDatecalc .dc-options-panel{max-width:calc(100vw - 16px)}

@media (max-width:900px){
  #pageDatecalc .dtl-shell{width:calc(100% - 12px);padding-top:.7rem}
  #pageDatecalc .dc-dates{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:.85rem!important}
  #pageDatecalc .dc-date-box{width:100%!important;max-width:none!important;margin:0!important}
  #pageDatecalc .dc-fields{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:.55rem!important}
  #pageDatecalc .dc-fields input{width:100%!important;font-size:16px!important}
  #pageDatecalc .dc-duration-row{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:.8rem!important;align-items:stretch!important}
  #pageDatecalc .dc-dur-ctrl,#pageDatecalc .dc-dur-center,#pageDatecalc .dc-dur-vars{width:100%!important;max-width:none!important;min-width:0!important;flex:none!important}
  #pageDatecalc .dc-dur-ctrl,#pageDatecalc .dc-dur-vars{display:flex;flex-wrap:wrap;justify-content:center;gap:.35rem .75rem;padding:.75rem;border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--bg-card)}
  #pageDatecalc .dc-dur-ctrl .dc-ctrl-title,#pageDatecalc .dc-dur-vars .dc-ctrl-title{width:100%;text-align:center}
  #pageDatecalc .dc-chk{margin:0}
  #pageDatecalc .dc-pm-row{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:.65rem!important}
  #pageDatecalc .dc-pm-fields{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:.5rem!important}
  #pageDatecalc .dc-calcmode{display:flex!important;flex-wrap:wrap!important;justify-content:center!important;gap:.45rem!important}
  #pageDatecalc .dc-results{display:grid!important;width:100%!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:.7rem!important;margin-inline:0!important;overflow:visible!important}
  #pageDatecalc .dc-pair{width:100%!important;display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:.45rem!important}
  #pageDatecalc .dc-months-grid{grid-template-columns:minmax(0,1fr)!important}
  #pageDatecalc .dc-month-list{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  #pageDatecalc .dtl-calendar-cards,#pageDatecalc .dtl-two-col,#pageDatecalc .dtl-events-list{grid-template-columns:minmax(0,1fr)!important}
}

@media (max-width:560px){
  #pageDatecalc .dtl-shell{width:100%;padding-inline:.35rem}
  #pageDatecalc .dtl-hero-simple{padding:.7rem .45rem .15rem}
  #pageDatecalc .dtl-hero-simple h1{font-size:1.55rem}
  #pageDatecalc .dtl-legacy-wrap{padding:.2rem;border-radius:12px}
  #pageDatecalc .dc-container{padding:.75rem .45rem 2rem!important}
  #pageDatecalc .dc-date-box{padding:.75rem .55rem!important}
  #pageDatecalc .dc-date-display{font-size:1rem;padding:.55rem}
  #pageDatecalc .dc-fields{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:.35rem!important}
  #pageDatecalc .dc-fields label{font-size:.7rem}
  #pageDatecalc .dc-fields input{padding:.45rem .2rem!important;font-size:16px!important}
  #pageDatecalc .dc-zodiac{grid-template-columns:minmax(0,1fr)!important;text-align:center}
  #pageDatecalc .dc-zodiac .dz-head{justify-content:center}
  #pageDatecalc .dc-pm-fields{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  #pageDatecalc .dc-results{grid-template-columns:minmax(0,1fr)!important;padding:.45rem!important}
  #pageDatecalc .dc-pair{grid-template-columns:minmax(0,1fr) auto!important;text-align:initial!important}
  #pageDatecalc .dc-month-list{grid-template-columns:minmax(0,1fr)!important}
  #pageDatecalc .dc-options-tab{right:auto!important;left:8px!important}
  #pageDatecalc .dc-options-panel{right:auto!important;left:8px!important;width:calc(100vw - 16px)!important}
}

/* V61: reliable mobile Options drawer open/close behavior */
@media (max-width:560px){
  #pageDatecalc .dc-options-tab{
    left:auto!important;
    right:0!important;
  }
  #pageDatecalc .dc-options-panel{
    left:auto!important;
    right:8px!important;
    width:calc(100vw - 16px)!important;
    max-width:360px!important;
    transform:translateX(calc(100% + 24px))!important;
    transition:transform .25s ease!important;
    visibility:hidden;
    pointer-events:none;
  }
  #pageDatecalc .dc-options-panel.open{
    right:8px!important;
    transform:translateX(0)!important;
    visibility:visible;
    pointer-events:auto;
  }
  #pageDatecalc .dc-opt-close{
    position:relative;
    z-index:3;
    min-width:34px;
    width:34px;
    height:34px;
    touch-action:manipulation;
  }
}
