:root { --ycc-red:#d63638; --ycc-black:#000; --ycc-bg:#f9f9f9; }
.ycc-master { font-family:'Inter',sans-serif; max-width:100%; margin:30px auto; color:#000; clear:both; }
.ycc-master * { box-sizing:border-box; }

.mc-header { background:#000; padding:35px; text-align:center; border-radius:14px; border-bottom:6px solid var(--ycc-red); margin-bottom:30px; }
.mc-header h2 { color:#fff!important; margin:0; text-transform:uppercase; font-weight:900; }
.ycc-tabs { display:flex; gap:4px; border-bottom:3px solid #000; margin-bottom:20px; flex-wrap:nowrap; }
.ycc-tab-link { padding:12px 16px; border:none; background:#ddd; cursor:pointer; font-weight:800; border-radius:10px 10px 0 0; text-transform:uppercase; font-size:11px; white-space:nowrap; }
.ycc-tab-link.active { background:#000; color:#fff!important; }
.ycc-content { display:none; padding:25px; background:var(--ycc-bg); border:1px solid #ddd; border-radius:0 0 14px 14px; }
.ycc-content.active { display:block; }
.ycc-box { background:#fff; padding:25px; border-radius:14px; border-left:8px solid var(--ycc-red); border-top:1px solid #ddd; border-right:1px solid #ddd; border-bottom:1px solid #ddd; margin-bottom:25px; position:relative; }
.ycc-box h3 { margin:0 0 20px 0; text-transform:uppercase; font-size:14px; color:var(--ycc-red); border-bottom:1px solid #eee; padding-bottom:10px; font-weight:900; }

.grid-6 { display:grid; grid-template-columns:repeat(6,1fr); gap:15px; margin-bottom:15px; }
.grid-5 { display:grid; grid-template-columns:repeat(5,1fr); gap:15px; margin-bottom:15px; }
.grid-4 { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.grid-2 { display:grid; grid-template-columns:repeat(2,1fr); gap:20px; }

.stat-card { background:#fff; border:2px solid #000; border-radius:12px; padding:18px; text-align:center; cursor:pointer; transition:0.2s; }
.stat-card:hover { border-color:var(--ycc-red); transform:translateY(-2px); box-shadow:0 4px 10px rgba(0,0,0,0.1); }
.stat-num { font-size:26px; font-weight:900; display:block; pointer-events:none; }
.stat-lab { font-size:9px; text-transform:uppercase; font-weight:bold; color:#666; pointer-events:none; }

.fld { margin-bottom:15px; }
.fld > label { display:flex; align-items:center; font-size:10px; font-weight:900; text-transform:uppercase; margin-bottom:6px; color:#555; }
.fld input[type="text"], .fld input[type="number"], .fld input[type="email"], .fld input[type="password"], .fld select, .fld textarea { width:100%; padding:12px 15px; border:1px solid #ccc; border-radius:8px; font-size:14px; background:#fff; }
.fld input:disabled, .fld select:disabled { background:#eee; cursor:not-allowed; font-weight:bold; }

.fld-radio-list { display:flex; flex-direction:column; gap:10px; }
.fld-radio-list label { display:inline-flex !important; align-items:center; gap:8px !important; font-size:14px !important; font-weight:normal !important; text-transform:none !important; color:#333 !important; margin:0 !important; cursor:pointer; }
.fld-radio-list input[type="radio"], .fld-radio-list input[type="checkbox"] { width:18px !important; height:18px !important; min-width:18px; min-height:18px; flex-shrink:0; margin:0 !important; cursor:pointer; accent-color:var(--ycc-red); }

.fld-switch-wrap { background:#fff; border:1px solid #ccc; border-radius:8px; height:45px; display:flex; align-items:center; padding:0 15px; }
.switch { position: relative; display: inline-block; width: 50px; height: 26px; margin-left: auto; }
.switch input { opacity: 0; width: 0; height: 0; }
.slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #ccc; transition: .4s; border-radius: 34px; }
.slider:before { position: absolute; content: ""; height: 18px; width: 18px; left: 4px; bottom: 4px; background-color: white; transition: .4s; border-radius: 50%; }
input:checked + .slider { background-color: #4caf50; }
#e-samtykke:checked + .slider { background-color: var(--ycc-red); }
input:checked + .slider:before { transform: translateX(24px); }

.ycc-help { display:inline-block; background:#333; color:#fff; width:16px; height:16px; border-radius:50%; text-align:center; line-height:16px; font-size:10px; cursor:help; margin-left:6px; font-weight:bold; position:relative; }
.ycc-help:hover { background:var(--ycc-red); }
.ycc-help::after { content: attr(data-tip); position: absolute; bottom: 150%; left: 50%; transform: translateX(-50%); background: #000; color: #fff; padding: 8px 12px; border-radius: 6px; font-size: 11px; white-space: normal; width: 220px; text-align: center; opacity: 0; visibility: hidden; transition: 0.2s; pointer-events: none; z-index: 999999; font-weight:normal; text-transform:none; line-height:1.4; box-shadow:0 4px 6px rgba(0,0,0,0.3); }
.ycc-help:hover::after { opacity: 1; visibility: visible; }

.ycc-table { width:100%; border-collapse:collapse; background:#fff; }
.ycc-table th { background:#333; color:#fff!important; padding:12px; text-align:left; font-size:11px; }
.ycc-table td { padding:12px; border-bottom:1px solid #eee; font-size:13px; }
.member-row:hover { background:#fffceb!important; cursor:pointer; }

.btn-black { background:#000; color:#fff!important; border:none; padding:18px; width:100%; font-weight:900; border-radius:10px; cursor:pointer; text-transform:uppercase; transition:0.2s; text-decoration:none; text-align:center; display:block; }
.btn-black:hover { background:var(--ycc-red); }
.btn-del { background:#d63638; color:#fff!important; border:none; padding:5px 10px; border-radius:6px; cursor:pointer; font-weight:900; }
.btn-inline { height:45px; padding:0 15px; border:none; border-radius:8px; cursor:pointer; font-weight:800; font-size:10px; text-transform:uppercase; color:#fff!important; }

.pfp-circle { width:35px; height:35px; border-radius:50%; object-fit:cover; vertical-align:middle; margin-right:10px; border:1px solid #ddd; background:#eee; }
.pfp-preview-wrap { text-align:center; margin-bottom:20px; }
.pfp-large { width:120px; height:120px; border-radius:50%; object-fit:cover; border:3px solid var(--ycc-red); background:#eee; display:block; margin:0 auto 10px; }

.ycc-gallery-wrap { display:flex; flex-wrap:wrap; justify-content:center; gap:15px; }
.ycc-gallery-wrap .ycc-grid-img-wrap { flex: 0 0 calc(25% - 11.25px); max-width:calc(25% - 11.25px); border-radius:8px; overflow:hidden; border:1px solid #ccc; height:220px; cursor:pointer; position:relative; background:#000; }
.ycc-gallery-wrap .ycc-grid-img-wrap img { width:100%; height:100%; object-fit:cover; transition:transform 0.3s, opacity 0.3s; opacity:0.9; }
.ycc-gallery-wrap .ycc-grid-img-wrap:hover img { transform:scale(1.05); opacity:1; }

.ycc-modal { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.92); z-index:999999; align-items:flex-start; justify-content:center; padding:40px 20px; overflow-y:auto; }
.ycc-modal-box { background:#fff; color:#000; padding:25px; border-radius:12px; width:100%; max-width:600px; position:relative; box-shadow:0 4px 15px rgba(0,0,0,0.3); margin:auto; }
.ycc-modal-box.ycc-modal-wide { max-width:850px; }
.ycc-modal-close { position:absolute; top:15px; right:20px; font-size:28px; cursor:pointer; color:#aaa; transition:0.2s; line-height:1; }
.ycc-modal-close:hover { color:#000; }
.ycc-btn-bli-medlem { display:inline-block; padding:16px 40px; background:#ce1126; color:#fff!important; border:none; border-radius:10px; font-weight:900; font-size:15px; text-transform:uppercase; letter-spacing:2px; cursor:pointer; text-decoration:none; transition:0.3s; box-shadow:0 4px 15px rgba(206,17,38,0.4); }
.ycc-btn-bli-medlem:hover { background:#a80d1e; transform:translateY(-2px); box-shadow:0 6px 20px rgba(206,17,38,0.5); }

#ycc-toast { display:none; position:fixed; top:30px; left:50%; transform:translateX(-50%); background:#d63638; color:#fff; padding:15px 30px; border-radius:8px; z-index:9999999; font-weight:bold; box-shadow:0 4px 15px rgba(0,0,0,0.3); font-size:14px; text-align:center; }

.ycc-news-card-wrap { display:flex; flex-wrap:wrap; justify-content:center; gap:20px; }
.ycc-news-card { background:#fff; border:1px solid #ddd; border-radius:8px; overflow:hidden; display:flex; flex-direction:column; width:calc((100% - 60px) / 4); min-width:250px; box-shadow:0 4px 6px rgba(0,0,0,0.05); }
.ycc-news-card-img { width:100%; height:200px; object-fit:cover; background:#eee; }
.ycc-news-card-content { padding:20px; flex:1; }
.ycc-news-title { margin:0 0 10px 0; font-size:18px; color:var(--ycc-red); }
.ycc-news-date { font-size:11px; color:#777; text-transform:uppercase; margin-bottom:15px; display:block; font-weight:bold; }

.ycc-news-classic-wrap { display:flex; flex-direction:column; gap:20px; }
.ycc-news-classic { display:flex; background:#fff; border:1px solid #ddd; border-radius:8px; overflow:hidden; box-shadow:0 4px 6px rgba(0,0,0,0.05); }
.ycc-news-classic-img { width:300px; flex-shrink:0; object-fit:cover; background:#eee; }
.ycc-news-classic-content { padding:25px; flex:1; }

.ycc-shop-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:15px; }
.ycc-shop-card { background:#000; border:1px solid #333; border-radius:8px; overflow:hidden; color:#fff; display:flex; flex-direction:column; }
.ycc-shop-thumb { width:100%; height:220px; object-fit:cover; display:block; border-bottom:1px solid #333; }
.ycc-shop-price { color:#ff3b3b; font-weight:900; }

.ycc-verv-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 280px)); gap: 25px; justify-content: center; margin: 0 auto; }   
.ycc-verv-card { background:#fff; border:1px solid #ddd; border-radius:10px; overflow:hidden; text-align:center; padding-bottom:20px; box-shadow:0 4px 6px rgba(0,0,0,0.05); }
.ycc-verv-img { width:100%; height:250px; object-fit:cover; background:#eee; border-bottom:3px solid var(--ycc-red); }
.ycc-verv-role { font-size:12px; text-transform:uppercase; color:var(--ycc-red); font-weight:900; margin:15px 0 5px; }
.ycc-verv-name { font-size:18px; font-weight:bold; margin-bottom:5px; color:#000; }
.ycc-verv-phone { font-size:14px; color:#555; }

/* DIGITALT MEDLEMSKORT CSS */
.dc-wrapper { background: #fff; border-radius: 12px; overflow: hidden; box-shadow: 0 10px 30px rgba(0,0,0,0.5); width: 100%; max-width: 500px; margin: 0 auto; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; color: #000; position: relative; border: 1px solid #ccc; }
.dc-header { background: linear-gradient(to right, #9a2020, #e33b3b); height: 60px; display: flex; align-items: center; justify-content: flex-end; padding: 0 15px; color: #fff; font-style: italic; font-weight: 900; font-size: 16px; letter-spacing: 1px; border-bottom: 4px solid #000; }
.dc-body { padding: 25px 20px; display: flex; justify-content: space-between; gap: 15px; background: #fdfdfd; }
.dc-text { flex: 1; }
.dc-text h2 { margin: 0 0 10px 0; font-size: 26px; text-transform: uppercase; font-weight: 900; letter-spacing: 1px; color: #000; }
.dc-text p { margin: 5px 0; font-size: 15px; color: #111; }
.dc-name { font-size: 18px !important; font-weight: 900 !important; margin-top: 2px !important; margin-bottom: 20px !important; display: block; }
.dc-logo { width: 130px; display: flex; align-items: center; justify-content: center; }
.dc-logo img { max-width: 100%; height: auto; object-fit: contain; }

@media(max-width:900px){ .grid-6, .grid-5, .grid-4, .grid-3, .grid-2, .ycc-shop-grid { grid-template-columns:1fr !important; } .ycc-gallery-wrap .ycc-grid-img-wrap { flex: 0 0 100%; max-width: 100%; } .ycc-news-card { width:calc((100% - 20px)/2); } .ycc-news-classic { flex-direction:column; } .ycc-news-classic-img { width:100%; height:220px; } }
@media(max-width:600px){ .ycc-news-card { width:100%; } }

/* Dashboard header & tabs – mobil-responsiv */
@media(max-width: 600px) {
    .mc-header { padding: 15px 10px !important; flex-direction: column !important; gap: 10px !important; }
    .mc-header > div:first-child { display: none !important; }
    .mc-header h2 { font-size: 16px !important; min-width: 0 !important; flex: unset !important; }
    .mc-header > div:last-child { text-align: center !important; flex: unset !important; min-width: 0 !important; }
    .mc-header > div:last-child a { padding: 8px 16px !important; font-size: 11px !important; }
    .ycc-tabs { flex-wrap: wrap !important; gap: 3px !important; }
    .ycc-tab-link { padding: 8px 10px !important; font-size: 10px !important; }
    .ycc-content { padding: 15px 10px !important; }
}

/* Bli Medlem – mobil-responsiv */
@media(max-width: 600px) {
    #ycc-innmelding-modal { padding: 0 !important; }
    #ycc-innmelding-modal > div { padding: 8px !important; border-radius: 0 !important; max-width: 100% !important; margin: 0 !important; box-shadow: none !important; }
    #ycc-innmelding-modal > div > div:first-of-type { padding: 15px !important; margin-bottom: 10px !important; border-radius: 6px !important; }
    #ycc-innmelding-modal h2 { font-size: 16px !important; letter-spacing: 0 !important; }
    #ycc-innmelding-modal .ycc-master { max-width: 100% !important; margin: 0 !important; }
    #ycc-innmelding-modal .ycc-box { padding: 10px !important; border-radius: 6px !important; }
    #ycc-innmelding-modal .fld { margin-bottom: 10px !important; }
    #ycc-innmelding-modal .fld label { font-size: 10px !important; margin-bottom: 4px !important; }
    #ycc-innmelding-modal .fld input,
    #ycc-innmelding-modal .fld select,
    #ycc-innmelding-modal .fld textarea { font-size: 16px !important; padding: 8px !important; }
    #ycc-innmelding-modal .btn-black { font-size: 14px !important; padding: 12px !important; }
    #ycc-innmelding-modal .fld-radio-list label { font-size: 12px !important; }
    #ycc-innmelding-modal .fld-radio-list { gap: 6px !important; }
    #ycc-innmelding-modal #fam-container { padding: 8px !important; margin-top: 10px !important; }
    #ycc-innmelding-modal #fam-container .grid-2,
    #ycc-innmelding-modal #fam-container .grid-3 { grid-template-columns: 1fr !important; gap: 8px !important; }
    #ycc-innmelding-modal [style*="padding:15px"] { padding: 8px !important; }
    #ycc-innmelding-modal [style*="padding:20px"] { padding: 8px !important; }
    #ycc-innmelding-modal [style*="margin-top:20px"] { margin-top: 10px !important; }
    #ycc-innmelding-modal #ycc-innmelding-modal-content { padding: 5px 0 !important; }
    .ycc-master { margin: 5px !important; }
    .ycc-master .ycc-box { padding: 10px !important; }
}

/* Krymper medlemskortet proporsjonalt på mobilskjermer (uten å endre layout) */
@media(max-width: 480px) {
    .dc-header { height: 45px; font-size: 12px; padding: 0 10px; }
    .dc-body { padding: 15px 10px; gap: 10px; }
    .dc-text h2 { font-size: 18px; margin-bottom: 5px; }
    .dc-text p { font-size: 12px; margin: 3px 0; }
    .dc-name { font-size: 14px !important; margin-bottom: 10px !important; }
    .dc-logo { width: 70px; }
}

/* SPONSOR & STØTTEKLUBBER */
.ycc-sponsor-wrap { display: flex; flex-wrap: wrap; gap: 30px; justify-content: center; align-items: center; margin-top: 20px; margin-bottom: 40px; }
.ycc-sponsor-link { display: block; transition: transform 0.3s ease, opacity 0.3s ease; }
.ycc-sponsor-link:hover { transform: scale(1.05); opacity: 0.8; }
.ycc-sponsor-logo { max-width: 180px; height: auto; object-fit: contain; }

/* ARRANGEMENTER / ARKIV – delte stiler */
.arr-list-box { background:#fff; border:1px solid #e1e1e1; border-radius:15px; padding:25px; margin-bottom:20px; box-shadow:0 2px 5px rgba(0,0,0,0.03); transition:transform 0.2s ease, box-shadow 0.2s ease; display:flex; flex-direction:column; gap:8px; text-align:left; }
.arr-list-box:hover { transform:translateY(-2px); box-shadow:0 5px 15px rgba(0,0,0,0.08); border-color:#d63638; }
.arr-list-box.pdf-search-item { min-height:80px; max-height:80px; }
.arr-date-badge { color:#d63638; font-weight:800; font-size:14px; text-transform:uppercase; }
.arr-title { margin:0; color:#111; font-size:22px; font-weight:800; border:none !important; padding:0 !important; }
.arr-content { font-size:16px; color:#444; line-height:1.6; }

/* Mapper – teknisk arkiv */
.ycc-folder-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:20px; margin-top:30px; }
.ycc-folder { background:#f9f9f9; border:1px solid #ddd; padding:20px; text-align:center; border-radius:15px; cursor:pointer; transition:0.2s; }
.ycc-folder:hover { border-color:#d63638; transform:translateY(-3px); box-shadow:0 5px 15px rgba(0,0,0,0.05); }

/* Mapper – referater */
.ycc-ref-folder-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:20px; margin-top:30px; }
.ycc-ref-folder { background:#f9f9f9; border:1px solid #ddd; padding:20px; text-align:center; border-radius:15px; cursor:pointer; transition:0.2s; }
.ycc-ref-folder:hover { border-color:#d63638; transform:translateY(-3px); box-shadow:0 5px 15px rgba(0,0,0,0.05); }

/* Bilder – galleri & lightbox */
.ycc-flex-grid { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-bottom:30px; max-width:100%; margin-left:auto; margin-right:auto; }
.ycc-grid-img-wrap { width:calc(25% - 6px); aspect-ratio:4/3; overflow:hidden; border-radius:6px; cursor:pointer; }
.ycc-grid-img-wrap img { width:100%; height:100%; object-fit:cover; transition:transform 0.2s ease; }
.ycc-grid-img-wrap:hover img { transform:scale(1.08); }
.ycc-img-folder-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:20px; margin-top:30px; }
.ycc-img-folder { background:#f9f9f9; border:1px solid #ddd; padding:20px; text-align:center; border-radius:15px; cursor:pointer; transition:0.2s; }
.ycc-img-folder:hover { border-color:#d63638; transform:translateY(-3px); box-shadow:0 5px 15px rgba(0,0,0,0.05); }
#ycc-lb { display:none; position:fixed; z-index:9999; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.9); align-items:center; justify-content:center; cursor:zoom-out; }
#ycc-lb img { max-width:90%; max-height:90%; border:3px solid #fff; border-radius:6px; }
@media (max-width:768px) { .ycc-flex-grid { max-width:100%; } .ycc-grid-img-wrap { width:calc(33.33% - 6px); } }

/* Teknisk & Referater – mobil-responsiv */
@media(max-width: 600px) {
    .arr-list-box.pdf-search-item {
        flex-direction: column !important;
        align-items: stretch !important;
        min-height: auto !important;
        max-height: none !important;
        padding: 15px !important;
        gap: 10px !important;
    }
    .arr-list-box.pdf-search-item .pdf-row {
        gap: 10px !important;
    }
    .arr-list-box.pdf-search-item .arr-title {
        font-size: 13px !important;
    }
    .arr-list-box.pdf-search-item .pdf-download-btn {
        text-align: center !important;
        padding: 10px 15px !important;
        font-size: 11px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
    .ycc-folder-grid,
    .ycc-ref-folder-grid,
    .ycc-img-folder-grid {
        grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)) !important;
        gap: 10px !important;
    }
    .ycc-folder,
    .ycc-ref-folder,
    .ycc-img-folder {
        padding: 12px !important;
    }
    .teknisk-sub-view h4,
    .ref-sub-view h4 {
        font-size: 18px !important;
    }
}


