@charset "utf-8";
/* CSS Document */

/* DTF page wrapper – zamedzenie pretečeniu na mobile */
.dtf-page-wrap {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow-x: hidden !important;
  box-sizing: border-box !important;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.dtf-page-wrap .dtf-form-row artworks, .dtf-page-wrap .dtf-form-row div > label, .dtf-page-wrap .dtf-form-row .artworks > label, .dtf-page-wrap .dtf-form-row artworks > div, label {
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  font-weight: 200;
  font-size: .9em;
}

/* padding 10px + overflow fix – prepisuje #bcid div zo siteone.css (100vw spôsobuje pretečenie) */
#bcid .dtf-form-wrap {
  width: 100% !important;
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
  overflow-x: hidden;
}

.row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
label { display:block; margin: 10px 0 0;  font-size:.8em; color:grey; }
#dtf-form-section { margin: 75px 0 50px 0; width: 50%; }
input, textarea { width: calc(100% - 20px); padding: 10px; border: 1px solid #ccc; border-radius: 6px; }
textarea { min-height: 90px; resize: vertical; }
.box { border: 1px solid #e5e5e5; border-radius: 10px; padding: 14px; margin-top: 14px; }
.artworks { margin: 30px 0; }
.hint { color:#555; font-size: 13px; margin-top: 6px; }
.error { color:#b00020; margin-top: 10px; }
.ok { color:#0a7a2f; margin-top: 10px; }
.files { margin: 8px 0 0; padding-left: 18px; }
.actions { margin-top: 16px; display:flex; gap:10px; align-items:center; }
button { padding: 10px 14px; border: 0; border-radius: 8px; cursor:pointer; }
/*button[type="submit"] { background: #111; color:#fff; }*/
button[type="button"] { background: #eee; }
.small { font-size: 12px; color:#666; }
.checkbox { display:flex; gap:8px; align-items:center; margin-top: 10px; }
.delivery__desc { font-weight: normal;  font-size: .9em; color: grey; }

#dtf-ok-section { display:block; margin-top: 30px; }
#dtf-ok-section div { padding:10px !important;border:1px solid #ccc;color:var(--mygreen);margin:10px 0;border-radius:10px; }
#dtf-ok-txt { margin-top:12px;white-space:pre-line;border:0;padding:0 !important; }
.dtf-form-help { font-size: .85em; color:grey; }

.dtf-form-help, .dtf-form-wrap h2, .dtf-form-wrap h3 { font-weight: normal; line-height: normal; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; }
.dtf-form-wrap h1 {font-size: 1.6em;}
.dtf-form-wrap h2 {font-size: 1.15em; }
.dtf-form-wrap h3 {font-size: 1.0em; }
.dtf-form-wrap form.labeltitle { font-weight: normal; display:block;margin-bottom:6px;color:grey }
.dtf-form-wrap form #submitBtn { 
    display: inline-block;
    text-align: center;
    border-radius: 10px;
}
.dtf-form-wrap form #info-cena { color:#C10000; font-weight: normal; font-size: .85em; }

/* Kontrola – tlačidlo Späť na formulár (šedé) */
#dtf-kontrola-section button.btnrd2[type="button"] { background: #666; }
#dtf-kontrola-section button.btnrd2[type="button"]:hover { background: #555; }

/* Súhrn objednávky – grid label/hodnota */
.dtf-summary-grid {
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: 8px 20px;
  align-items: baseline;
  margin-top: 16px;
  max-width: 560px;
}
.dtf-summary-label {
  font-weight: 600;
  color: #333;
}
.dtf-summary-label--block {
  margin-top: 12px;
}
.dtf-summary-value {
  color: #555;
}





/*---------------- delivery block -------------*/
:root{
    --accent: #c10000;     /* fialová ako v screen2 */
    --muted: #6b7280;
    --border: #e5e7eb;
    --mygreen: #0a7a2f;
  }
  
  .checkout-block__title{
    font-weight: 700;
    margin: 6px 0 10px;
  }
  
  .delivery{
    display: flex;
    flex-direction: column;
    gap: 10px;
  }
  
  /* Celý riadok option */
  .delivery__opt{
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 0px 0px;
    border-radius: 12px;
    cursor: pointer;
    border: 1px solid transparent;
  }
  
  .delivery__opt:hover{
    background: rgba(164,10,209,.04);
  }
  
  .delivery__opt input[type="radio"]{
    position: absolute;
    opacity: 0;
    pointer-events: none;
  }
  
  /* “Custom” rádio */
  .delivery__radio{
    width: 18px;
    height: 18px;
    border-radius: 999px;
    border: 2px solid #cfcfd6;
    flex: 0 0 18px;
    margin-top: 2px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  
  .delivery__radio::after{
    content: "";
    width: 10px;
    height: 10px;
    border-radius: 999px;
    transform: scale(0);
    transition: transform .12s ease;
    background: var(--mygreen);
  }
  
  .delivery__opt input:checked + .delivery__radio{
    border-color: var(--mygreen);
  }
  
  .delivery__opt input:checked + .delivery__radio::after{
    transform: scale(1);
  }
  
  /* Text v strede (2 riadky) */
  .delivery__text{
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 1;
    min-width: 0;
  }
  
  .delivery__name{
    font-weight: 700;
    color: #111;
    line-height: 1.1;
  }
  
  .delivery__desc{
    font-size: 13px;
    color: var(--muted);
  }
  
  /* Cena vpravo */
  .delivery__price{
    margin-left: auto;
    white-space: nowrap;
    font-weight: 700;
    color: #111;
  }
  
  /* Extra boxy (Packeta / DPD) pod voľbou – odsadené */
  .delivery__extra{
    margin-left: 42px; /* zarovná pod text (radio + gap) */
    padding: 10px;
    border: 1px dashed #d1d5db;
    border-radius: 12px;
  }
  
  /* Form prvky */
  .delivery__btn{
    padding: 8px 12px;
    border: 0;
    border-radius: 10px;
    cursor: pointer;
  }
  
  .delivery__note{
    margin-top: 8px;
    font-size: 13px;
    color: #444;
  }
  
  .delivery__field{
    margin: 8px 0;
  }
  
  .delivery__label{
    display: block;
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 6px;
  }
  
  .delivery__field input{
    width: 100%;
    padding: 10px;
    border: 1px solid var(--border);
    border-radius: 10px;
  }
  #clientMsg { font-size: 0.8em; }
/*---------------- delivery block -------------*/
  




/*========================================================================*/
@media screen and (max-width: 768px) {
  html { overflow-x: hidden !important; width: 100% !important; max-width: 100% !important; }
  body { overflow-x: hidden !important; max-width: 100% !important; width: 100% !important; min-width: 0 !important; }
  #bodycenter { display: block !important; width: 100% !important; max-width: 100% !important; overflow-x: hidden !important; }
  #bcid { overflow-x: hidden !important; max-width: 100% !important; width: 100% !important; }
  /* prepis 100vw zo siteone – zabráni pretečeniu na mobile */
  #bcid div, #bcid main, #bcid section, #bcid main div, #bcid main section {
    max-width: 100% !important;
    box-sizing: border-box !important;
    min-width: 0 !important;
  }
  #bcid .dtf-form-wrap {
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  /* DTF sekcie – menšie paddingy, aby sa zmestili na mobile */
  .dtf-page-wrap .dtf-section {
    padding: 12px 10px !important;
    margin: 12px 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    min-width: 0 !important;
    overflow: hidden;
  }
  .dtf-page-wrap .dtf-polozka {
    padding: 10px 8px !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    min-width: 0 !important;
  }
  .dtf-page-wrap .dtf-polozka-cena {
    word-wrap: break-word;
    overflow-wrap: break-word;
    font-size: 0.9em;
    padding: 6px !important;
  }

  /* Súhrnný box – rows umožni zalomenie, aby sa cena nezastrčila za okraj */
  .dtf-page-wrap .dtf-total-box {
    padding: 10px 10px !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    min-width: 0 !important;
  }
  .dtf-page-wrap .dtf-total-box .dtf-total-row {
    flex-wrap: wrap;
    gap: 2px 8px;
    min-width: 0;
  }
  .dtf-page-wrap .dtf-total-box .dtf-total-row > span:first-child {
    flex: 1 1 auto;
    min-width: 0;
    word-break: break-word;
  }
  .dtf-page-wrap .dtf-total-box .dtf-total-row > span:last-child {
    flex: 0 0 auto;
    white-space: nowrap;
    text-align: right;
  }

  /* Submit tlačidlo – povoliť zalomenie a nikdy nepretiecť */
  .dtf-page-wrap .dtf-btn,
  .dtf-page-wrap #submitBtn {
    white-space: normal !important;
    word-break: break-word;
    overflow-wrap: break-word;
    line-height: 1.3;
    padding: 12px 10px !important;
    font-size: 0.95em;
  }
  .dtf-page-wrap .dtf-form-row.dtf-submit-row {
    padding: 0 !important;
    margin-bottom: 8px !important;
  }
  .dtf-page-wrap .dtf-submit-wrap {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Nadpisy – nech text nepreteká a nemá nechcené pravé odsadenie */
  .dtf-page-wrap .dtf-form-wrap h1 { font-size: 1.35em !important; line-height: 1.2 !important; }
  .dtf-page-wrap .dtf-form-wrap h2 { font-size: 1.0em !important; line-height: 1.35 !important; }
  .dtf-page-wrap .dtf-form-wrap h3 { font-size: 0.95em !important; line-height: 1.35 !important; }

  /* "Pridať položku" wrap */
  .dtf-page-wrap .dtf-add-item-wrap {
    flex-direction: column;
    align-items: stretch;
  }
  .dtf-page-wrap .dtf-add-item-btn {
    width: 100% !important;
    text-align: center;
    white-space: normal !important;
  }

  /* ======== KONTROLA objednávky (thank-you / kontrolná stránka) ======== */
  .dtf-page-wrap #dtf-kontrola-section,
  .dtf-page-wrap #dtf-ok-section {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 8px !important;
    box-sizing: border-box !important;
  }
  .dtf-page-wrap .thank-you-section {
    padding: 16px 12px !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow-wrap: break-word;
    word-break: break-word;
  }
  .dtf-page-wrap .thank-you-section h1 {
    font-size: 1.15em !important;
    line-height: 1.25 !important;
    margin-top: 8px !important;
    word-break: break-word;
    overflow-wrap: break-word;
  }
  .dtf-page-wrap .thank-you-section h3 {
    font-size: 1.0em !important;
    line-height: 1.3 !important;
    margin-top: 14px !important;
  }

  /* Súhrnný grid label/hodnota – jednostĺpcové na mobile */
  .dtf-page-wrap .dtf-summary-grid {
    display: block !important;
    max-width: 100% !important;
    margin-top: 10px !important;
  }
  .dtf-page-wrap .dtf-summary-grid > span {
    display: block;
    word-break: break-word;
    overflow-wrap: break-word;
  }
  .dtf-page-wrap .dtf-summary-label {
    margin-top: 8px;
    font-size: 0.9em;
  }
  .dtf-page-wrap .dtf-summary-value {
    margin: 2px 0 6px;
    padding-left: 0;
  }

  /* Tabuľka položiek – scrollovateľná a kompaktná */
  .dtf-page-wrap .dtf-items-table {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    font-size: 0.85em;
  }
  .dtf-page-wrap .dtf-items-table thead,
  .dtf-page-wrap .dtf-items-table tbody,
  .dtf-page-wrap .dtf-items-table tr {
    display: table;
    width: 100%;
    table-layout: fixed;
  }
  .dtf-page-wrap .dtf-items-table th,
  .dtf-page-wrap .dtf-items-table td {
    padding: 5px 6px !important;
    word-break: break-word;
    overflow-wrap: break-word;
    vertical-align: top;
  }

  /* Tlačidlá na kontrolnej stránke – plná šírka a zalomenie textu */
  .dtf-page-wrap #dtf-kontrola-section form,
  .dtf-page-wrap #dtf-kontrola-section .btnrd2 {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  .dtf-page-wrap #dtf-kontrola-section button.btnrd2,
  .dtf-page-wrap #dtf-ok-section .dtf-btn-reorder {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    white-space: normal !important;
    word-break: break-word;
    overflow-wrap: break-word;
    line-height: 1.3 !important;
    padding: 12px 10px !important;
    margin: 8px 0 !important;
    box-sizing: border-box !important;
    font-size: 0.95em;
  }
  /* topbar + menu – zamedzenie pretečeniu */
  #toplineHome, #toplineHome #topS {
    max-width: 100% !important;
    width: 100% !important;
    overflow-x: hidden !important;
    word-wrap: break-word !important;
    box-sizing: border-box !important;
  }
  #toplineHome #topS a { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
  #cssmn, #cssmenu, #cssmenu #menu-button {
    max-width: 100% !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
  }
  /* DTF formulár – už od 768px jedna stĺpec (inline má 600px) */
  .dtf-form-wrap .dtf-form-row,
  #dtf-form-section .dtf-form-row {
    grid-template-columns: 1fr !important;
    gap: 6px 0 !important;
    padding: 0 0px !important;
    margin-bottom: 16px !important;
  }
  .dtf-form-wrap .dtf-form-row label,
  #dtf-form-section .dtf-form-row label { padding-top: 0 !important; }
  .dtf-form-wrap .dtf-form-row .dtf-form-help,
  #dtf-form-section .dtf-form-row .dtf-form-help { grid-column: 1 !important; }
  /* delivery – ceny musia byť vždy viditeľné */
  .checkout-block, .delivery { max-width: 100% !important; min-width: 0 !important; overflow-x: hidden !important; }
  .delivery__opt {
    min-width: 0 !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
  }
  .delivery__price { flex-shrink: 0 !important; margin-left: 0 !important; width: 100% !important; text-align: right !important; }
  .dtf-form-row.artworks { grid-template-columns: 1fr !important; }
  .dtf-form-row.artworks #info-cena { grid-column: 1 !important; }
  /* Smartsupp chat – v rámci viewportu */
  #smartsupp-widget-container { max-width: 100vw !important; }
  #smartsupp-widget-container [data-testid="widgetButtonFrame"] { right: 8px !important; }
  #webfoot, #nwld, #footbott, #fop { max-width: 100% !important; overflow-x: hidden !important; }
  #webfoot, #nwld, #nmsg2, #footbott, #fop { max-width: 100% !important; overflow-wrap: break-word !important; }
  .dtf-page-wrap { width: 100% !important; max-width: 100% !important; min-width: 0 !important; overflow-x: hidden !important; box-sizing: border-box !important; }
  .ttilu3 { max-width: 100% !important; width: 100% !important; display: block !important; box-sizing: border-box !important; }
  

  /*---------------- thank you section -------------*/
  /* dtf-ok-section a celý dtf obsah – width/overflow fix (prepisuje 100vw z siteone) */
  #bcid #dtf-ok-section,
  #bcid .dtf-form-wrap,
  .dtf-form-wrap {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
  }
  #dtf-ok-section { box-sizing: border-box !important; }
  .dtf-form-wrap form #submitBtn {
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  .thank-you-section {
    padding:24px;
    box-sizing: border-box;
    background: transparent;
    border: none;
    margin:16px 0;
    font-size:16px;
    line-height:1.6;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    display: block;
  }
/*---------------- thank you section -------------*/


  .dtf-form-wrap h1,
  .dtf-form-wrap h2,
  .dtf-form-wrap p,
  .dtf-form-wrap .inf,
  .dtf-form-wrap > br + *,
  .dtf-form-wrap input,
  .dtf-form-wrap textarea {
    max-width: 100%;
    word-wrap: break-word;
    overflow-wrap: break-word;
    box-sizing: border-box;
    padding:0;
  }
  #dtf-form-section {
    width: 100% !important;
    max-width: 100% !important;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  }
  #bcid .dtf-form-wrap button[type="submit"],
  #bcid .dtf-form-wrap div,
  #bcid .dtf-form-wrap form,
  #bcid .dtf-form-wrap form label,
  #bcid .dtf-form-wrap form input,
  #bcid .dtf-form-wrap form textarea,
  #bcid .dtf-form-wrap form button,
  #bcid .dtf-form-wrap form select,
  #bcid .dtf-form-wrap form option {
    box-sizing: border-box;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  }
  .dtf-form-row > div { min-width: 0; }
  #fileList li { overflow-wrap: anywhere; word-break: break-word; }
  
  /* file input na plnú šírku */
  #dtfUploadForm input[type="file"] {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }
  
  /* delivery – menej odsadenie, zamedzenie pretečeniu */
  .delivery__extra { margin-left: 0 !important; }
  .delivery__opt { min-width: 0; }
  .delivery__text { min-width: 0; overflow-wrap: break-word; word-break: break-word; }
  .delivery__price { flex-shrink: 0; }
  .checkout-block { max-width: 100% !important; min-width: 0 !important; overflow-wrap: break-word; }
  
  /* dtf tlačidlá a wrappery */
  .dtf-submit-wrap, .dtf-reorder-wrap { max-width: 100% !important; }
}
/*========================================================================*/