/* German in Context · A1+ Curriculum Ticket V3
   Compact two-column ticket on mobile, not a vertically stacked panel.
   Purely visual override loaded after v2; no script, API or access-rule changes. */

/* At wide widths v2 is already horizontal. Keep it, refine the ticket silhouette. */
.gic-curriculum-ticket-v2 .gic-current-ticket {
  border-radius:23px;
}

/* On phones the ticket stays horizontal: destination to the left, progress/CTA to the right. */
@media (max-width:700px) {
  .gic-curriculum-ticket-v2 .gic-current-ticket {
    display:grid;
    grid-template-columns:minmax(0,60%) minmax(0,40%) !important;
    align-items:stretch;
    border-radius:20px;
    overflow:hidden;
    min-height:0;
    box-shadow:0 12px 27px rgba(23,65,54,.09), inset 0 1px 0 rgba(255,255,255,.92);
  }

  /* Restore the traditional notches at the long outside edges. */
  .gic-curriculum-ticket-v2 .gic-current-ticket::before,
  .gic-curriculum-ticket-v2 .gic-current-ticket::after {
    display:block;
    content:"";
    position:absolute;
    top:50%;
    bottom:auto;
    transform:translateY(-50%);
    width:16px;
    height:16px;
    border-radius:50%;
    background:#eff4f1;
    box-shadow:inset 0 0 0 1px rgba(148,132,94,.13);
    z-index:3;
    pointer-events:none;
  }
  .gic-curriculum-ticket-v2 .gic-current-ticket::before {left:-8px;right:auto;}
  .gic-curriculum-ticket-v2 .gic-current-ticket::after  {right:-8px;left:auto;}

  .gic-curriculum-ticket-v2 .gic-current-main {
    min-width:0;
    padding:16px 12px 15px 16px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    background:linear-gradient(132deg,#fffaf0 0%,#fffef8 95%);
  }

  .gic-curriculum-ticket-v2 .gic-current-main::before {display:none;}
  .gic-curriculum-ticket-v2 .gic-current-main::after {
    display:block;
    content:"";
    position:absolute;
    right:0;
    top:13px;
    bottom:13px;
    left:auto;
    width:1px;
    height:auto;
    border:0;
    border-radius:0;
    background:repeating-linear-gradient(to bottom,rgba(167,137,80,.52) 0 5px,transparent 5px 10px);
    z-index:1;
  }

  .gic-curriculum-ticket-v2 .gic-current-kicker {
    margin:0 0 10px;
    color:#927645;
    font-size:8px;
    font-weight:850;
    line-height:1.25;
    letter-spacing:.08em;
    overflow-wrap:break-word;
  }
  .gic-curriculum-ticket-v2 .gic-current-route {
    display:inline-flex;
    gap:4px;
    align-items:center;
    align-self:flex-start;
    max-width:100%;
    margin:0 0 12px;
    padding:5px 6px;
    background:#f4efe2;
    font-size:8px;
    line-height:1.25;
    letter-spacing:0;
    white-space:normal;
    border-radius:9px;
    overflow-wrap:anywhere;
  }
  .gic-curriculum-ticket-v2 .gic-current-route svg{
    width:14px;
    height:14px;
    flex:none;
  }
  .gic-curriculum-ticket-v2 .gic-current-title{
    margin:0 0 8px;
    color:#154f41;
    font-family:Newsreader,Georgia,serif;
    font-size:clamp(29px,7.7vw,40px);
    line-height:.99;
    letter-spacing:-.055em;
    overflow-wrap:break-word;
  }
  .gic-curriculum-ticket-v2 .gic-current-title span{
    display:block;
    margin:9px 0 0;
    font-family:Newsreader,Georgia,serif;
    font-size:clamp(16px,4.2vw,21px);
    font-weight:700;
    line-height:1.12;
    letter-spacing:-.015em;
    overflow-wrap:break-word;
  }
  .gic-curriculum-ticket-v2 .gic-current-desc{
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    line-clamp:2;
    overflow:hidden;
    margin:0 0 8px;
    font-size:10px;
    line-height:1.42;
    color:#73817b;
  }
  /* Route already shows the chapter number; keep only one compact progress chip. */
  .gic-curriculum-ticket-v2 .gic-current-tags{gap:4px;}
  .gic-curriculum-ticket-v2 .gic-current-tags span:first-child{display:none;}
  .gic-curriculum-ticket-v2 .gic-current-tags span{
    padding:4px 7px;
    font-size:9px;
    font-weight:800;
    border-radius:8px;
  }

  .gic-curriculum-ticket-v2 .gic-current-side{
    min-width:0;
    display:flex !important;
    flex-direction:column;
    justify-content:center;
    align-items:stretch;
    padding:16px 11px;
    background:linear-gradient(155deg,#135b49 0%,#0b4538 100%);
  }
  .gic-curriculum-ticket-v2 .gic-current-side-label{
    font-size:9px;
    line-height:1.3;
    letter-spacing:.06em;
    color:#f2d391;
  }
  .gic-curriculum-ticket-v2 .gic-current-percent{
    display:block;
    margin:8px 0 10px;
    font:800 clamp(27px,7vw,37px)/1 Newsreader,Georgia,serif;
    color:#fff9e7;
    white-space:nowrap;
  }
  .gic-curriculum-ticket-v2 .gic-current-track{
    height:7px;
    min-height:7px;
    border-radius:99px;
  }
  .gic-curriculum-ticket-v2 .gic-current-action-slot{margin-top:14px;}
  .gic-curriculum-ticket-v2 .gic-current-action-slot .gic-current-action,
  .gic-curriculum-ticket-v2 button.gic-current-action.gic-chapter-premium-lock{
    display:flex !important;
    width:100% !important;
    min-height:40px !important;
    margin:0 !important;
    padding:7px 6px !important;
    align-items:center !important;
    justify-content:center !important;
    border-radius:12px !important;
    background:linear-gradient(130deg,#f1cf79,#d4aa57) !important;
    color:#153d32 !important;
    font-size:11px !important;
    line-height:1.25 !important;
    font-weight:850 !important;
    text-align:center;
    text-wrap:balance;
    white-space:normal;
    overflow-wrap:anywhere;
    box-shadow:0 5px 12px rgba(0,0,0,.12) !important;
  }
}

/* Extra small phones: maintain two columns without clipping important actions. */
@media (max-width:360px){
  .gic-curriculum-ticket-v2 .gic-current-ticket{
    grid-template-columns:minmax(0,59%) minmax(0,41%) !important;
  }
  .gic-curriculum-ticket-v2 .gic-current-main{padding:13px 9px 13px 13px;}
  .gic-curriculum-ticket-v2 .gic-current-side{padding:13px 9px;}
  .gic-curriculum-ticket-v2 .gic-current-kicker{font-size:7px;margin-bottom:7px;}
  .gic-curriculum-ticket-v2 .gic-current-route{font-size:7.3px;gap:3px;padding:4px 5px;margin-bottom:9px;}
  .gic-curriculum-ticket-v2 .gic-current-route svg{width:12px;height:12px;}
  .gic-curriculum-ticket-v2 .gic-current-title{font-size:28px;margin-bottom:6px;}
  .gic-curriculum-ticket-v2 .gic-current-title span{font-size:15px;margin-top:7px;}
  .gic-curriculum-ticket-v2 .gic-current-desc{font-size:9px;margin-bottom:7px;}
  .gic-curriculum-ticket-v2 .gic-current-tags span{font-size:8px;}
  .gic-curriculum-ticket-v2 .gic-current-side-label{font-size:8px;}
  .gic-curriculum-ticket-v2 .gic-current-percent{font-size:27px;}
  .gic-curriculum-ticket-v2 .gic-current-action-slot .gic-current-action,
  .gic-curriculum-ticket-v2 button.gic-current-action.gic-chapter-premium-lock{
    min-height:38px !important;
    font-size:10.5px !important;
  }
}

/* Keep the left half in harmony with dark study mode. */
html[data-gic-theme="dark"] .gic-curriculum-ticket-v2 .gic-current-main,
html[data-theme="dark"] .gic-curriculum-ticket-v2 .gic-current-main{
  background:linear-gradient(135deg,#263c32,#1a3027);
}
html[data-gic-theme="dark"] .gic-curriculum-ticket-v2 .gic-current-title,
html[data-theme="dark"] .gic-curriculum-ticket-v2 .gic-current-title{
  color:#edf3ee;
}
html[data-gic-theme="dark"] .gic-curriculum-ticket-v2 .gic-current-desc,
html[data-theme="dark"] .gic-curriculum-ticket-v2 .gic-current-desc{
  color:#b4c5ba;
}
