/* MagicKcal Support v1.1 / test candidate. Existing Styleguide v0.29.64 codes. */
.mkSupport form { display:grid; gap:12px; }
.mkSupport textarea { min-height:110px; resize:vertical; width:100%; box-sizing:border-box; }
.mkSupport #mkSupportCode { width:min(100%,220px); }
.mkSupportActions { display:flex; justify-content:flex-end; }
.mkSupportInternal { display:flex; align-items:center; justify-content:flex-end; gap:14px; }
html.mkIPhone .favoriteSubTabs, html.mkIPhone .settingsSubTabs { margin-left:auto!important; margin-right:auto!important; align-self:center; }
html.mkIPhone .favoriteSubTabs, html.mkIPhone .settingsSubTabs { position:relative; left:50%; transform:translateX(-50%); margin-left:0!important; margin-right:0!important; width:max-content; max-width:100%; }
html.mkStyleguideV014 body.mkStyleguideV014 .mkSupport a.CC-CI { color:var(--cc-ci)!important; font-weight:700!important; text-decoration:none!important; }
/* The phone library grid must measure its tabs against the main card's content. */
html.mkIPhone .favoriteLibraryCard { grid-template-columns:minmax(0,1fr); }
html.mkIPhone .favoriteLibraryCard .favoriteSubTabs { justify-self:center; left:auto; transform:none; min-width:0; box-sizing:border-box; }

/* Chat100w3: approved support-only layout; phone tab centering above retained. */
.mkSupportCodeRow { display:flex; align-items:center; gap:12px; min-width:0; }
.mkSupportCodeRow label { white-space:nowrap; flex:none; }
.mkSupport .mkSupportCodeRow #mkSupportCode { min-width:0; flex:1; width:auto; max-width:220px; }
.mkSupport form > p { margin:0; }
html.mkStyleguideV014 body.mkStyleguideV014 .mkSupport .mkSupportThanks { color:var(--cc-ci)!important; font-weight:700!important; }
/* Accessible neutral focus, scoped to Support; global styleguide is unchanged. */
html.mkStyleguideV014 body.mkStyleguideV014 #mkSupport :is(input,textarea):focus {
  border-color:var(--cc-b2)!important; box-shadow:none!important;
  outline:1px solid var(--cc-w)!important; outline-offset:2px!important;
}
html.mkStyleguideV014 body.mkStyleguideV014 #mkSupport :is(button,a):focus-visible {
  box-shadow:none!important; outline:1px solid var(--cc-w)!important; outline-offset:3px!important;
}

/* Chat102 B5 / App 1.2.195.353: Rechtliches und Support links in einer
   Kontospaltenbreite. Konto-Gap .85rem berücksichtigt, Padding im Border-Box.
   Desktop ab Zweispalten-Breakpoint; iPad ausschließlich quer, iPhone nie. */
@media (min-width: 761px) {
  html.mkStyleguideV014:not(.mkIPhone):not(.mkIPad) body.mkStyleguideV014 .settingsTabbedCard > .settingsTabPanel > :is(.settingsInfoCard, #mkSupport) {
    width: calc((100% - .85rem) / 2) !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}
@media (min-width: 761px) and (orientation: landscape) {
  html.mkIPad.mkStyleguideV014 body.mkStyleguideV014 .settingsTabbedCard > .settingsTabPanel > :is(.settingsInfoCard, #mkSupport) {
    width: calc((100% - .85rem) / 2) !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

/* Work126w1: existing KC support-number geometry, scoped only to Mein Tarif. */
.contractFields .accountPlanLabel { display:grid; grid-template-columns:25px minmax(0,1fr); align-items:center; gap:8px; white-space:normal!important; overflow:visible!important; }
.contractFields .accountPlanLabelText { min-width:0; white-space:normal!important; overflow-wrap:anywhere; }
html.mkStyleguideV014 body.mkStyleguideV014 .contractFields .authFieldRow input { padding-inline:.55rem!important; }
.contractFields .accountPlanSupportIndex {
  flex:0 0 25px; width:25px; height:25px; display:inline-grid; place-items:center;
  border:1px solid rgba(92,224,138,.6); border-radius:50%; color:var(--day-today);
  background:rgba(92,224,138,.06); font-size:.7rem; font-weight:800;
  line-height:1; font-variant-numeric:tabular-nums;
}
@media(max-width:760px) {
  .contractFields .authFieldRow { grid-template-columns:minmax(0,42%) minmax(0,1fr)!important; }
}
@media(max-width:360px) {
  .contractFields .authFieldRow { grid-template-columns:minmax(0,1fr)!important; }
}