/* Nahrávání fotek hostů — vzhled v jazyce svatebního webu:
   papír, jediná vínová, vysoký serif. */

:root {
  --papir:   #F1E8E3;
  --vino:    #541319;
  --vino-70: rgba(84, 19, 25, .7);
  --vino-45: rgba(84, 19, 25, .45);
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--papir);
  color: var(--vino);
  font: 16px/1.55 Georgia, 'Times New Roman', serif;
  -webkit-font-smoothing: antialiased;
}

.obal {
  max-width: 420px;
  margin: 0 auto;
  padding: max(32px, env(safe-area-inset-top)) 24px
           max(32px, env(safe-area-inset-bottom));
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-height: 100dvh;
}

.titul {
  font-weight: 400;
  font-size: 34px;
  letter-spacing: .04em;
  text-align: center;
  margin: 8px 0 0;
}
.titul span { font-style: italic; }

.uvita {
  text-align: center;
  color: var(--vino-70);
  margin: 0 0 10px;
}

.tlacitko {
  display: block;
  width: 100%;
  text-align: center;
  padding: 18px;
  border: 1px solid var(--vino);
  border-radius: 2px;
  letter-spacing: .14em;
  text-transform: uppercase;
  font-size: 15px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  background: none;
  color: inherit;
  font-family: inherit;
}

.tlacitko--hlavni {
  background: var(--vino);
  color: var(--papir);
  padding: 26px 18px;
  font-size: 18px;
}

.stav {
  min-height: 1.4em;
  text-align: center;
  margin: 4px 0 0;
}

.prubeh {
  width: 100%;
  height: 5px;
  accent-color: var(--vino);
}

.fronta {
  text-align: center;
  color: var(--vino-70);
  min-height: 1.4em;
  margin: 0;
}

.jmeno-obal {
  display: block;
  color: var(--vino-70);
  font-size: 14px;
  margin-top: 8px;
}
.jmeno-obal input {
  display: block;
  width: 100%;
  margin-top: 6px;
  padding: 12px;
  border: 1px solid var(--vino-45);
  border-radius: 2px;
  background: none;
  color: var(--vino);
  font: inherit;
  font-size: 16px;   /* pod 16 px iPhone při fokusu zoomuje */
}

.navod {
  border: 1px dashed var(--vino-45);
  border-radius: 2px;
  padding: 14px 16px;
  margin-top: 10px;
}
.navod h2 {
  font-weight: 400;
  font-size: 16px;
  margin: 0 0 6px;
}
.navod p { margin: 0; color: var(--vino-70); font-size: 14px; }

.pata {
  margin-top: auto;
  padding-top: 18px;
  text-align: center;
  color: var(--vino-45);
  font-size: 13px;
}