@font-face {
    font-family: 'BastionKontrastAltC';
    src: url('/sert/BastionKontrastAltC-Italic.woff2') format('woff2'),
        url('/sert/BastionKontrastAltC-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}
.ff {
    font-family: 'BastionKontrastAltC';
    font-weight: normal;
    font-style: italic;
}
:root{
  --brand:#507eba; 
  --brand-dark:#027eaf; 
  --danger:#dc2626; 
  --border:#e5e7eb;
  --text:#111827; 
  --muted:#6b7280; 
  --bg:#f8fafc; 
  --gold:#1b3257;
  --primary-color: #1b3257;
  --secondary-color: #416996;
  --accent-color: #7b8db0;
  --bg-light: #f8fafc;
  --text-dark: #1e293b;
  --white: #ffffff;
  --border-radius: 10px;
  --shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1); 
}
*{box-sizing:border-box}
body{margin:0;font-family:-apple-system,'Segoe UI',Roboto,Arial,sans-serif;background:var(--bg);color:var(--text)}
.cert-app{max-width:1200px;margin:30px auto;padding:0 16px}
h1{font-size:26px;margin:0 0 20px}
.tabs{display:flex;gap:8px;border-bottom:2px solid var(--border);margin-bottom:24px}
.tab{border:none;background:none;padding:12px 20px;cursor:pointer;font-size:15px;color:var(--muted);border-bottom:3px solid transparent}
.tab.active{color:var(--brand);border-bottom-color:var(--brand);font-weight:600}
.panel{display:none}
.panel.active{display:block}
section#tab-list {
    background: var(--white);
    padding: 10px;
    border-radius: var(--border-radius);
    box-shadow: var(--shadow);
}
form {
    background: #fff;
    padding: 24px;
    border-radius: 12px;
    border: 1px solid var(--border);
    max-width: 100%;
    background: var(--white);
    padding: 40px;
    border-radius: var(--border-radius);
    box-shadow: var(--shadow);
}
.row { display: flex; gap: 20px; flex-wrap: wrap; }
.col-6 { flex: 1; min-width: 250px; }

label{display:block;font-size:14px;font-weight:600;margin:14px 0 6px}
input{
    width:100%;
    padding:14px 12px;
    border:2px solid #f1f5f9;
    border-radius:8px;
    font-size:1rem;
    transition: all 0.3s;
    background: #f8fafc;
}
input:focus{outline:2px solid var(--brand);border-color:transparent}
input[disabled]{background:#f3f4f6;color:var(--muted)}
.btn{display:inline-block;border:none;border-radius:8px;padding:14px 18px;font-size:14px;cursor:pointer;background:var(--primary-color);color:#fff;font-weight:600}
.btn:hover{background:var(--brand-dark);color: #fff;}
.btn.danger{background:var(--danger)}
.btn.small{padding:6px 12px;font-size:13px}
.btn.primary{margin-top:18px}
table{width:100%;border-collapse:collapse;background:#fff;border-radius:12px;overflow:hidden;border:1px solid var(--border)}
th,td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--border);font-size:14px}
th{background:#f1f5f9;font-weight:600}
tr:last-child td{border-bottom:none}

/* Сертификат */
.certificate{background:#fff}
.cert-inner{
    border:0px solid var(--gold);
    border-radius:16px;
    padding:100px 40px;
    position:relative;
    max-width:100%;
    margin:0 auto;
    background-image: url('../sert/k01.jpg');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 642px;
}
.cert-inner::before{content:'';position:absolute;inset:8px;border:0px solid var(--gold);border-radius:10px;pointer-events:none}

.cert-sub {
    font-size: 20px;
    color: #4f4285;
    display: none;
}
.cert-company {
    font-size: 70px;
    font-weight: 500;
    margin: 12px 0;
    color: #ffc404;
    left: 190px;
    position: absolute;
    top: 75px;
    font-family: 'BastionKontrastAltC';
    text-align: center;
}
.cert-line{width:80px;height:2px;background:var(--gold);margin:18px auto}
.cert-points {
    font-size: 34px;
    color: #e7302a;
    font-weight: 500;
    left: 465px;
    position: absolute;
    top: 353px;
    font-family: 'BastionKontrastAltC';
}
span.cert-points-note {
    display: block;
    font-size: 16px;
    font-weight: 400;
}
.cert-validity {
    font-size: 34px;
    color: #e7302a;
    font-weight: 500;
    left: 135px;
    position: absolute;
    top: 353px;
    font-family: 'BastionKontrastAltC';
}
.cert-number {
    font-size: 13px;
    color: var(--muted);
    margin-top: 8px;
    bottom: 70px;
    position: absolute;
    left: 45px;
}

/* Модальное окно */
.modal{position:fixed;inset:0;background:rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center;z-index:50;padding:20px}
.modal.hidden{display:none}
.modal-content{background:#fff;border-radius:12px;padding:24px;max-width:960px;width:100%;max-height:100vh;overflow:auto;position:relative}
.modal-content .close {
    position: absolute;
    top: -25px;
    right: 1px;
    font-size: 48px;
    cursor: pointer;
    color: #dc3545;
    z-index: 1;
}
#cert-preview{margin-bottom:16px}

@media print, screen {
  .cert-inner.no-border-for-pdf {
    border: none;
  }
}
.cert-issue-date {
    font-size: 14px;
    margin-top: -10px;
    display: none;
}
.hidden {
    display: none;
}

/* Новые стили для кнопок */
.btn-row { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 15px; }
.share-buttons { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 15px; align-items: center; }
.share-buttons a { 
    text-decoration: none; 
    color: #fff; 
    font-weight: 600; 
    padding: 10px 16px; 
    border-radius: 8px; 
    font-size: 14px; 
    display: inline-block; 
    transition: opacity 0.2s; 
}
.share-buttons a:hover { opacity: 0.85; }
.share-tg { background: #229ED9; }
.share-vk { background: #0077FF; }
.share-max { background: #8f40de; }