/*
Theme Name: campervloggers.nl
Theme URI: https://vandaagdedag.nl/
Author: campervloggers.nl
Description: Persoonlijk overzicht van favoriete campervloggers met YouTube RSS-import.
Version: 2.0.2
Requires at least: 6.2
Requires PHP: 8.0
Text Domain: campervideo
*/
:root{--navy:#132943;--mint:#bce5d8;--bg:#f5f7f9;--ink:#17283b;--line:#dce3e9}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 system-ui,-apple-system,Segoe UI,sans-serif}a{color:#12628b}header.site{background:var(--navy);color:#fff}header.site .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 0}header.site a{color:white;text-decoration:none}.brand{font-size:1.35rem;font-weight:800}.wrap{width:min(1160px,calc(100% - 36px));margin:auto}.menu{display:flex;gap:1rem;flex-wrap:wrap}main{min-height:65vh;padding:2rem 0}h1,h2,h3{line-height:1.2}h1{font-size:clamp(1.8rem,4vw,2.7rem)}.hero{background:var(--mint);border-radius:20px;padding:2rem;margin-bottom:2rem}.button,button,input[type=submit]{display:inline-block;background:var(--navy);border:0;border-radius:10px;color:white;padding:.65rem 1rem;text-decoration:none;cursor:pointer;font:inherit}.button:hover,button:hover{background:#285477}.secondary{background:#e8eef2;color:var(--ink)}.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(245px,1fr));gap:20px}.card{background:#fff;border:1px solid var(--line);border-radius:15px;overflow:hidden}.card-content{padding:14px}.card h3{margin:.2rem 0;font-size:1.08rem}.card p{margin:.3rem 0;color:#526577;font-size:.9rem}.thumb{display:block;aspect-ratio:16/9;background:#dbe3e8}.thumb img{width:100%;height:100%;object-fit:cover}.channel-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}.channel-choice{display:flex;gap:12px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px}.channel-choice input{width:20px;height:20px}.notice{padding:12px 16px;border-radius:10px;background:#e4f3ed;margin:1rem 0}.notice.error{background:#ffe8e8}.toolbar{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin:1rem 0 1.5rem}.muted{color:#657586}.form-box{max-width:480px;background:#fff;padding:24px;border-radius:15px;border:1px solid var(--line)}.form-box input:not([type=submit]){width:100%;padding:10px;border:1px solid #b7c4ce;border-radius:8px}footer.site{padding:2rem 0;background:#e8eef2;color:#475b6e}.pagination{display:flex;gap:10px;justify-content:center;margin:2rem 0}.pagination a,.pagination span{padding:6px 12px;background:#fff;border-radius:8px}.screen-reader-text{position:absolute;left:-9999px}@media(max-width:650px){header.site .wrap{align-items:flex-start;flex-direction:column}.hero{padding:1.3rem}}
/* Vormgeving afgestemd op Vandaag de Dag Magazine 0.7.56 */
:root{--navy:#1a3867;--mint:#c5fce9;--bg:#fff;--ink:#1a3867;--line:#d4e8e3;--orange:#e28d32}
body{background:#fff;color:var(--ink)}a{color:var(--navy)}a:hover{color:var(--orange)}header.site{background:#fff;color:var(--navy);border-bottom:2px solid var(--mint)}header.site a{color:var(--navy)}header.site a:hover{color:var(--orange)}.brand{letter-spacing:-.025em;font-weight:900;font-size:clamp(25px,3vw,37px)}.hero{background:var(--mint);color:var(--navy);border-radius:0;padding:clamp(36px,5vw,70px) 32px}.hero h1{letter-spacing:-.04em}.button,button,input[type=submit]{background:var(--orange);border-radius:999px;font-weight:750}.button:hover,button:hover{background:var(--navy);color:#fff}.secondary{background:var(--mint);color:var(--navy)}.card{border-radius:14px;box-shadow:0 5px 20px rgba(26,56,103,.07)}.card h3 a{text-decoration:none}.channel-choice{border-color:var(--line)}.channel-choice.mandatory{background:var(--mint)}.channel-choice small{display:block;font-size:.78rem;color:var(--navy)}.notice{background:var(--mint)}footer.site{background:var(--navy);color:#fff}footer.site a{color:#fff}a:focus-visible,button:focus-visible{outline:3px solid var(--orange);outline-offset:3px}

/* Eigen accountpagina's in de Vandaag de Dag-huisstijl */
.auth-layout{display:grid;grid-template-columns:1fr 1fr;max-width:1020px;margin:1.5rem auto 3rem;background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:0 12px 40px rgba(26,56,103,.08)}
.auth-intro{background:var(--mint);padding:clamp(28px,5vw,64px);display:flex;flex-direction:column;justify-content:center}
.auth-intro h1{font-size:clamp(2rem,4vw,3.4rem);letter-spacing:-.04em;margin:.6rem 0}
.auth-eyebrow{color:var(--navy);font-size:.85rem;font-weight:800;letter-spacing:.13em}
.auth-panel{padding:clamp(24px,4vw,54px)}
.auth-panel h2{font-size:1.85rem;margin:0 0 .5rem}
.auth-panel p{margin:0 0 1.4rem}
.auth-panel form{display:flex;flex-direction:column;gap:9px;margin:1.5rem 0}
.auth-panel label{font-weight:700;font-size:.93rem}
.auth-panel input:not([type=checkbox]){width:100%;padding:13px 14px;border:1px solid #afc5c5;border-radius:10px;font:inherit;color:var(--ink);margin-bottom:10px;background:#fff}
.auth-panel input:focus-visible{outline:3px solid var(--mint);border-color:var(--navy)}
.auth-panel button{width:100%;margin-top:12px;padding:13px}
.auth-check{display:flex;align-items:center;gap:9px;font-weight:400!important}
.auth-panel a{font-weight:700}
@media(max-width:750px){.auth-layout{grid-template-columns:1fr}.auth-intro{padding:30px}.auth-panel{padding:28px}}

.profile-page{max-width:1080px;margin:2rem auto 4rem}
.profile-heading{margin-bottom:2rem}.profile-heading h1{font-size:clamp(2rem,4vw,3rem);margin:.3rem 0}
.profile-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-bottom:22px}
.profile-panel{background:#fff;border:1px solid var(--line);border-radius:18px;padding:clamp(20px,3vw,34px);box-shadow:0 8px 25px rgba(26,56,103,.05)}
.profile-panel h2{margin:0 0 1rem}.profile-panel form{display:flex;flex-direction:column;gap:9px}
.profile-panel label{font-weight:700}.profile-panel input:not([type=checkbox]){width:100%;padding:12px 14px;border:1px solid #afc5c5;border-radius:10px;font:inherit;margin-bottom:10px}
.profile-panel button{align-self:flex-start;margin-top:10px}.profile-favorites .channel-grid{margin-top:1.5rem}
@media(max-width:750px){.profile-grid{grid-template-columns:1fr}}

.channel-choice{display:flex;align-items:center;gap:12px}
.cv-avatar{display:block;flex:0 0 52px;width:52px;height:52px;border-radius:50%;object-fit:cover;background:#c5fce9}
.cv-avatar-fallback{display:flex;align-items:center;justify-content:center;color:#1a3867;font-size:20px}
.channel-choice span:last-child{min-width:0}

/* Consistente kanaaltegels */
.channel-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr));gap:16px;align-items:stretch}
.channel-choice,.profile-panel .channel-choice{display:flex;flex-direction:column;justify-content:space-between;align-items:center;text-align:center;gap:12px;min-height:242px;height:100%;padding:24px 16px 18px;border:1px solid #d4e8e3;border-radius:18px;background:#fff;box-shadow:0 4px 14px rgba(26,56,103,.045);cursor:pointer;transition:border-color .15s,box-shadow .15s,transform .15s}
.channel-choice:hover{border-color:#7fcfba;box-shadow:0 8px 24px rgba(26,56,103,.10);transform:translateY(-2px)}
.channel-choice.mandatory{background:#e3fbf2;cursor:default}
.cv-channel-top{display:flex;justify-content:center;align-items:center;flex:0 0 auto}
.cv-avatar{display:block;flex:none;width:82px;height:82px;border-radius:50%;object-fit:cover;background:#c5fce9;border:3px solid white;box-shadow:0 0 0 1px #d4e8e3}
.cv-avatar-fallback{display:flex;align-items:center;justify-content:center;color:#1a3867;font-size:28px}
.cv-channel-name{display:block;flex:1;min-width:0;max-width:100%;font-size:1rem;font-weight:800;line-height:1.35;overflow-wrap:anywhere}
.cv-channel-bottom{display:flex;align-items:center;justify-content:center;gap:8px;font-size:.83rem;font-weight:600;min-height:28px}
.cv-channel-bottom input{margin:0;accent-color:#1a3867;width:19px;height:19px}
.cv-channel-bottom input:disabled{opacity:1}
@media(max-width:520px){.channel-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.channel-choice,.profile-panel .channel-choice{min-height:225px;padding:17px 9px}.cv-avatar{width:68px;height:68px}.cv-channel-bottom{font-size:.72rem}}

/* Mijn profiel gebruikt dezelfde beschikbare breedte en dezelfde tegels als Mijn vloggers. */
.profile-page{max-width:1160px}
.profile-panel.profile-favorites{padding:0;border:0;border-radius:0;box-shadow:none;background:transparent}
.profile-favorites form{display:block}
.profile-favorites .channel-grid{margin-top:1.5rem}
/* Een vaste minimale tegelbreedte voorkomt onnodig afbreken van kanaalnamen. */
.channel-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr))}
@media(max-width:520px){.channel-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Video's afspelen binnen campervloggers.nl */
.cv-video-open{cursor:pointer}.thumb.cv-video-open{position:relative;width:100%;padding:0;border:0;border-radius:0;background:#dbe3e8;overflow:hidden;display:block;aspect-ratio:16/9}.thumb.cv-video-open img{width:100%;height:100%;object-fit:cover}.cv-play-symbol{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:64px;height:46px;border-radius:13px;background:rgba(26,56,103,.9);color:#fff;font-size:23px}.cv-video-open:hover .cv-play-symbol{background:#e28d32}.cv-video-title{border:0;background:none;padding:0;color:var(--navy);font:inherit;font-weight:inherit;text-align:left;border-radius:0;line-height:inherit}.cv-video-title:hover{background:none;color:var(--orange);text-decoration:underline}.cv-video-dialog[hidden]{display:none!important}.cv-video-dialog{position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center;padding:18px}.cv-video-backdrop{position:absolute;inset:0;background:rgba(8,22,41,.86)}.cv-video-panel{position:relative;width:min(1120px,100%);max-height:calc(100dvh - 36px);overflow:auto;background:#fff;border-radius:15px;padding:16px;box-shadow:0 16px 60px rgba(0,0,0,.3)}.cv-video-panel-header{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:12px}.cv-video-panel-header h2{font-size:clamp(1rem,2vw,1.35rem);margin:0}.cv-video-close{border:0;border-radius:50%;font-size:30px;line-height:1;width:42px;height:42px;padding:0;flex-shrink:0}.cv-video-frame{aspect-ratio:16/9;background:#0b1322}.cv-video-frame iframe{width:100%;height:100%;border:0;display:block}.cv-video-fallback{font-size:.85rem;margin:12px 0 0}.cv-video-dialog-open{overflow:hidden}@media(max-width:600px){.cv-video-dialog{padding:8px}.cv-video-panel{padding:10px;max-height:calc(100dvh - 16px)}}

/* Contactpagina en voorstellen van nieuwe campervloggers */
.cv-contact-page{max-width:780px;margin:0 auto 3rem}.cv-contact-intro{background:var(--mint);padding:24px 30px;border-radius:16px;margin-bottom:22px}.cv-contact-intro h2{margin:0 0 8px}.cv-contact-intro p{margin:0}.cv-contact-form{display:flex;flex-direction:column;gap:9px;padding:clamp(20px,4vw,36px);background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 8px 25px rgba(26,56,103,.06)}.cv-contact-form label{font-weight:750}.cv-contact-form input:not([type=hidden]),.cv-contact-form textarea{width:100%;border:1px solid #afc5c5;border-radius:10px;padding:12px 14px;font:inherit;color:var(--ink);margin-bottom:9px}.cv-contact-form textarea{resize:vertical}.cv-contact-form button{align-self:flex-start}.cv-contact-note{font-size:.85rem;color:#526577;margin:4px 0}.cv-contact-honeypot{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* 1.9.1: De mintgroene paginatitel loopt op iedere pagina van rand tot rand. */
main.wrap{min-width:0}
.cv-fullwidth-hero{position:relative;width:100vw;width:100dvw;max-width:none;margin-left:calc(50% - 50vw);margin-left:calc(50% - 50dvw);margin-right:0;background:var(--mint);border-radius:0;margin-top:-2rem;margin-bottom:2rem;padding:clamp(32px,5vw,65px) max(18px,calc((100vw - 1160px)/2));padding-left:max(18px,calc((100dvw - 1160px)/2));padding-right:max(18px,calc((100dvw - 1160px)/2))}
.cv-hero-inner{max-width:1160px;margin:0 auto}.cv-fullwidth-hero h1{margin:0 0 .3em;color:var(--navy)}.cv-fullwidth-hero p{margin:0;color:var(--navy)}
.profile-page{max-width:1160px;margin:0 auto 4rem}.profile-heading.cv-fullwidth-hero{margin-bottom:2rem}
.cv-contact-page{max-width:780px;margin:0 auto 3rem}.cv-contact-intro{background:transparent;border-radius:0;padding:0;margin:0 0 22px}.cv-contact-intro h2{margin:0 0 8px}
.auth-layout{margin-top:0}.auth-intro h2{font-size:clamp(1.6rem,3vw,2.5rem);line-height:1.2;margin:.6rem 0}
.cv-page-content{margin-bottom:3rem}
@media(max-width:650px){.cv-fullwidth-hero{padding-top:32px;padding-bottom:32px}}

/* Logo naast de sitetitel */
header.site .brand{display:inline-flex;align-items:center;gap:12px;line-height:1.15}
header.site .brand-logo{width:54px;height:54px;object-fit:contain;flex:none}
@media(max-width:650px){header.site .brand-logo{width:43px;height:43px}}

/* 1.9.3: Contactformulier met nette veldgroepen en optionele kanaal-URL. */
.cv-contact-hero-description{max-width:850px;line-height:1.6;font-size:1.05rem;margin-top:12px!important}
.cv-contact-page{max-width:860px;margin:0 auto 3rem}
.cv-contact-form{display:grid;grid-template-columns:1fr;gap:7px;padding:clamp(22px,4vw,42px)}
.cv-contact-form>label{margin-top:12px}
.cv-contact-form input:not([type=hidden]):not([type=checkbox]),.cv-contact-form textarea{margin:0;width:100%;min-width:0}
.cv-contact-form .cv-contact-field{display:flex;flex-direction:column;gap:10px;margin-top:12px}
.cv-contact-form .cv-contact-checkline{display:flex;align-items:center;gap:11px;font-size:.95rem;font-weight:600;cursor:pointer;line-height:1.4;margin:0}
.cv-contact-form .cv-contact-checkline input[type=checkbox]{width:19px;height:19px;min-width:19px;margin:0;accent-color:var(--navy)}
.cv-contact-form .cv-contact-help{font-size:.86rem;color:#526577;margin:0 0 5px}
.cv-contact-form .cv-contact-note{margin:16px 0 6px}
.cv-contact-form button{margin-top:2px}
.cv-contact-form input:disabled{background:#f2f6f5;color:#677}
@media(max-width:650px){.cv-contact-form{padding:20px}.cv-contact-hero-description{font-size:1rem}}

/* Footer, in de stijl van vandaagdedag.nl */
footer.site.cv-site-footer{background:#1a3867;color:#fff;padding:48px 0 22px}
.cv-footer-inner{display:flex;flex-direction:column;gap:38px}
.cv-footer-details h2{font-size:1.3rem;font-weight:800;margin:0 0 15px;color:#fff}
.cv-footer-details address{font-style:normal;line-height:1.75;margin-bottom:8px}
footer.site.cv-site-footer a{color:#fff;text-decoration:none}
footer.site.cv-site-footer a:hover{text-decoration:underline;color:#c5fce9}
.cv-footer-bottom{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;border-top:1px solid rgba(255,255,255,.22);padding-top:18px;font-size:.9rem;color:rgba(255,255,255,.84)}
@media(max-width:650px){footer.site.cv-site-footer{padding:35px 0 20px}.cv-footer-inner{gap:26px}.cv-footer-bottom{align-items:flex-start;flex-direction:column}}

/* 1.9.7: openbare videobibliotheek en vloggerscatalogus */
.cv-video-filters{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin:0 0 22px}.cv-video-filters label{font-weight:700}.cv-video-filters select{min-width:210px;max-width:100%;padding:11px;border:1px solid #b5c8ce;border-radius:9px;background:#fff;font:inherit}.cv-discover-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:18px;margin:22px 0 45px}.cv-discover-card{background:#fff;border:1px solid #d4e8e3;border-radius:18px;padding:25px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px}.cv-discover-card .cv-avatar{width:96px;height:96px}.cv-discover-card h3{margin:4px 0}.cv-discover-card p{margin:0 0 10px;flex:1}.cv-discover-card .button{margin-top:auto}.cv-join-box{background:#e3fbf2;border-radius:18px;padding:clamp(22px,4vw,38px);margin:32px 0}.cv-join-box h2{margin-top:0}.cv-join-box .button{margin:4px 8px 4px 0}@media(max-width:600px){.cv-video-filters{align-items:stretch;flex-direction:column}.cv-video-filters select{width:100%}}

.cv-delete-account{margin-top:30px;border:1px solid #e8c9c9}.cv-delete-account button{background:#9b2c32}.cv-delete-account form{max-width:480px}.cv-delete-account input{width:100%}footer.cv-site-footer a{color:#fff}
