/* ===== pay-photo-dialog.css (updated for 4-up, bigger SBP, fullheight mobile) ===== */
:root{
    --ppd-bg: rgba(15, 23, 42, 0.78);
    --ppd-surface: #ffffff;
    --ppd-text: #0f172a;
    --ppd-muted: #64748b;
    --ppd-radius: 16px;
    --ppd-accent: #1dd370;
    --ppd-accent-700: #17b760;
    --ppd-dark: #0b1220;
}

.pay-photo-overlay{position:fixed;inset:0;background:#fff;display:none;align-items:center;justify-content:center;z-index:10000;}
.pay-photo-overlay.is-open{display:flex;}

.pay-photo-sheet{
    width:min(720px, 96vw);
    max-height:none;
    height:92vh;                 /* выше — меньше шансов на скролл */
    overflow:hidden;             /* убираем общий скролл */
    background:var(--ppd-surface);
    color:var(--ppd-text);
    border:none !important;
    border-radius:20px;
    /*box-shadow:0 20px 60px rgba(0,0,0,.25);*/
    padding:22px 20px 18px;
    display:flex;
    flex-direction:column;
    gap:16px;
}

/* Header: SBP card — лого ×4 и текст немного больше */
.ppd-sbp-card{display:flex;gap:14px;align-items:center;background:#f7f9ff;border:none !important;border-radius:14px;padding:14px 16px;}
.ppd-sbp-card .ppd-sbp-svg{width:160px;height:auto;flex:0 0 160px;display:block;} /* было ~40px → теперь x4 */
.ppd-sbp-card .ppd-sbp-title{font-weight:800;font-size:22px;margin:0 0 4px;}
.ppd-sbp-card .ppd-sbp-sub{font-size:16px;color:var(--ppd-muted);margin:0;}

/* ← ДОБАВЛЕНО: шапка-благодарность после оплаты */
.ppd-thanks{
    background:#f7f9ff;
    border-radius:14px;
    padding:16px 18px;
    line-height:1.5;
}
.ppd-thanks h3{
    margin:0 0 6px;
    font-weight:800;
    font-size:18px;
    color:#0f172a;
}
.ppd-thanks p{
    margin:0;
    color:#64748b;
    font-size:14px;
}

/* Контент — без общего скролла, но внутренним блокам можно */
.pay-photo-body{display:flex;flex-direction:column;gap:14px;min-height:0;}
.ppd-media{display:flex;flex-direction:column;gap:12px;min-height:0;}

/* 4 миниатюры вместо одной большой */
.ppd-photo{display:none;} /* прячем старую одиночную фотку */
.ppd-photo-grid{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:1px;
}
.ppd-photo-item{aspect-ratio:3/4;background:#f8fafc;overflow:hidden;}
.ppd-photo-item img{width:100%;height:100%;object-fit:cover;display:block;}

/* Upload (under photo) + иконка */
/* ← ТРЕБУЕМОЕ ИЗМЕНЕНИЕ: по умолчанию скрыто, появится после клика «Оплатить…» */
.ppd-upload{
    display:none;
    background:#f8fafc;
    border:none !important;
    border-radius:12px;
    padding:14px;
    display:flex;flex-direction:column;gap:10px;
    flex:0 0 auto;
}
.ppd-drop{padding:16px;border:none !important;border-radius:10px;background:#eef2ff;text-align:center;color:#334155;}
.ppd-drop input{display:none;}
.ppd-upload-cta{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:10px;background:#e2e8f0;cursor:pointer;font-weight:700;}
.ppd-upload-ico{width:18px;height:18px;display:inline-block;}
.ppd-drop.dragover{background:#e0e7ff;}

/* PDF info (above buttons) */
.ppd-pdf-info{
    background:#f8fafc;border:none !important;border-radius:12px;padding:12px 14px;color:#475569;font-size:14px;
    flex:0 0 auto;
}

/* Buttons row at bottom */
.ppd-actions{display:flex;gap:10px;margin-top:auto;flex:0 0 auto;}
.ppd-btn{flex:1;appearance:none;border:none !important;border-radius:14px;padding:14px 16px;font-weight:800;font-size:16px;cursor:pointer;transition:.15s transform ease;}
.ppd-btn:active{transform:translateY(1px);}
.ppd-btn--primary{background:var(--ppd-accent);color:#fff;}
.ppd-btn--primary:hover{background:var(--ppd-accent-700);}
.ppd-btn--ghost{background:var(--ppd-dark);color:#fff;}

/* ← ДОБАВЛЕНО: большая кнопка «Скачать PDF» */
.ppd-pdf-button{
    display:inline-block;
    width:100%;
    border:none !important;
    border-radius:14px;
    padding:16px 18px;
    font-weight:800;
    font-size:18px;
    cursor:pointer;
    background:var(--ppd-accent);
    color:#fff;
    margin-top:4px;
}
.ppd-pdf-button:active{transform:translateY(1px);}
.ppd-pdf-button:hover{background:var(--ppd-accent-700);}

/* Info toast */
.ppd-toast{
    display:none;
    background: #0ea5e9ee;
    color: #fff;
    border: none !important;
    border-radius: 12px;
    padding: 12px 0;
    font-size: 14px;
    position: absolute;
    left: 10px;
    right: 10px;
    text-align: center;
    box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 10px;
    /* top: 0px; */
    bottom: 10px;
    height: 65px;
    /* margin: auto; */
    align-items: center;
}
.ppd-toast.is-show{display:block;}

/* Minimal thumbs grid (если где-то используется в коде) */
.ppd-thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;}
.ppd-thumb{aspect-ratio:3/4;background:#f1f5f9;border-radius:10px;overflow:hidden;}
.ppd-thumb img{width:100%;height:100%;object-fit:cover;display:block;}

/* Close button */
.pay-photo-close{position:absolute;top:8px;right:10px;background:#ffffff;color:#000;border:none;border-radius:999px;width:36px;height:36px;display:grid;place-items:center;font-size:22px;cursor:pointer}

/* Никаких бордеров внутри */
.pay-photo-sheet *{border:none !important;}

/* Mobile */
@media (max-width: 640px){
    .pay-photo-sheet{width:100vw;height:100dvh;max-height:100dvh;padding:14px 12px 12px;border-radius:0; padding-top: 50px}
    .ppd-sbp-card{gap:12px;padding:12px;}
    .ppd-sbp-card .ppd-sbp-svg{width:120px;flex-basis:120px;} /* чуть меньше, но всё ещё крупно */
    .ppd-sbp-card .ppd-sbp-title{font-size:16px;}
}