/* Lector flipbook: papel cálido, portada y lomo discreto; apariencia corporativa. */
.cdr-flipbook { margin:15px 0 20px; border:1px solid #dfe7ec; border-radius:15px; background:#f5f7f9; overflow:hidden; }
.flipbook-toolbar { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; padding:13px 15px; background:#fff; border-bottom:1px solid #e5ebf0; }
.flipbook-heading { font-size:9px; letter-spacing:.11em; font-weight:900; color:#657889; }
.flipbook-controls { display:flex; gap:8px; align-items:center; }
.flipbook-arrow { display:grid; place-items:center; width:32px; height:32px; border:1px solid #d8e1e8; border-radius:8px; background:#fff; color:#29465c; font-size:23px; line-height:1; }
.flipbook-arrow:hover:not(:disabled),.flipbook-classic:hover { background:#eef3f6; }
.flipbook-arrow:disabled { opacity:.4; cursor:not-allowed; }
.flipbook-counter { min-width:102px; text-align:center; font-size:11px; color:#597084; font-weight:800; }
.flipbook-classic { background:#edf2f5; border:1px solid #dfe8ed; border-radius:8px; padding:9px 10px; font-size:10px; color:#34536b; font-weight:800; }
.flipbook-stage { padding:25px 25px 20px; min-height:220px; background:radial-gradient(ellipse at 50% 27%,#ffffff 0%,#e7edf1 93%); }
.flipbook-book { position:relative; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); aspect-ratio:1.42; max-width:100%; margin:auto; perspective:1650px; transform-style:preserve-3d; filter:drop-shadow(0 15px 14px #233a512a); isolation:isolate; }
.flipbook-book::before { content:""; position:absolute; inset:auto 7% -10px; height:19px; border-radius:50%; pointer-events:none; background:#172f4438; filter:blur(11px); }
.flipbook-book::after { content:""; position:absolute; top:0; bottom:0; left:calc(50% - 3px); width:6px; z-index:2; pointer-events:none; background:linear-gradient(90deg,#273b4d2d,#ffffff9c 45%,#263b4945); box-shadow:0 0 7px #263b4940; }
.flipbook-paper { background:#fffdfa; position:relative; overflow:hidden; display:flex; align-items:center; justify-content:center; border:1px solid #e1ddd3; }
.flipbook-left { border-radius:9px 1px 1px 9px; box-shadow:inset 12px 0 16px #253c4212, inset -9px 0 13px #253c4215; }
.flipbook-right { border-radius:1px 9px 9px 1px; box-shadow:inset -12px 0 16px #253c4212, inset 9px 0 13px #253c4215; }
.flipbook-paper canvas { display:block; max-width:100%; max-height:100%; object-fit:contain; }
.flipbook-blank { color:#a8b1b6; letter-spacing:.19em; font-weight:900; font-size:9px; }
.flipbook-page-number { position:absolute; bottom:8px; color:#8d9598; background:#ffffffd9; border-radius:9px; padding:2px 6px; font-size:9px; }
.flipbook-book.single-page { grid-template-columns:1fr; aspect-ratio:.71; width:min(100%,430px); }
.flipbook-book.single-page::after,.flipbook-book.single-page .flipbook-left { display:none; }
.flipbook-book.single-page .flipbook-right { border-radius:8px; }
.flipbook-turn-sheet { position:absolute; z-index:5; top:0; bottom:0; width:50%; transform-style:preserve-3d; will-change:transform; pointer-events:none; }
.flipbook-page-face { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; overflow:hidden; background:#fffdfa; border:1px solid #ddd9cf; box-shadow:inset 0 0 12px #554b2b12,0 9px 18px #1b35433d; backface-visibility:hidden; -webkit-backface-visibility:hidden; }
.flipbook-page-face::after { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(90deg,#1e2e4026 0%,transparent 28%,transparent 77%,#ffffffa8 100%); mix-blend-mode:multiply; }
.flipbook-page-back { transform:rotateY(180deg); background:#fff9ef; }
.flipbook-page-back::after { background:linear-gradient(270deg,#21334427 0%,transparent 25%,transparent 75%,#ffffff8c 100%); }
.flipbook-turn-sheet canvas { display:block; width:100%; height:100%; object-fit:contain; }
.flipbook-turn-sheet.turn-next { right:0; transform-origin:0 50%; animation:flipbook-next .71s cubic-bezier(.48,.08,.25,1) forwards; }
.flipbook-turn-sheet.turn-prev { left:0; transform-origin:100% 50%; animation:flipbook-prev .71s cubic-bezier(.48,.08,.25,1) forwards; }
.single-page .flipbook-turn-sheet { width:100%; }
.single-page .flipbook-turn-sheet.turn-next { transform-origin:0 50%; }
.single-page .flipbook-turn-sheet.turn-prev { transform-origin:100% 50%; }
@keyframes flipbook-next { 0% { transform:rotateY(0deg) rotateZ(0deg); filter:brightness(1); } 42% { filter:brightness(.78); } 56% { transform:rotateY(-108deg) rotateZ(-.7deg); filter:brightness(.83); } 100% { transform:rotateY(-180deg) rotateZ(0deg); filter:brightness(1); } }
@keyframes flipbook-prev { 0% { transform:rotateY(0deg) rotateZ(0deg); filter:brightness(1); } 42% { filter:brightness(.8); } 56% { transform:rotateY(108deg) rotateZ(.7deg); filter:brightness(.84); } 100% { transform:rotateY(180deg) rotateZ(0deg); filter:brightness(1); } }
.flipbook-status { padding:0 25px; text-align:center; color:#758799; font-size:11px; min-height:14px; margin:0; }
.flipbook-hint { padding:0 18px 15px; text-align:center; color:#98a6b0; font-size:10px; margin:3px 0 0; }
.flipbook-classic-iframe { display:block; width:100%; height:min(68vh,690px); border:1px solid #dbe4eb; border-radius:9px; background:#fff; }
.pdf-reader-host>iframe { display:block; width:100%; height:min(68vh,690px); border:1px solid #dbe4eb; border-radius:9px; background:#fff; }
@media (min-width:1201px) { .learning-grid:has(.cdr-flipbook) { grid-template-columns:minmax(300px,.63fr) minmax(610px,1.37fr); } }
@media (max-width:740px) { .flipbook-toolbar { gap:10px; } .flipbook-stage { padding:18px 12px; } .flipbook-heading { width:100%; } .flipbook-controls { width:100%; justify-content:space-between; } .flipbook-hint { font-size:10px; } }
@media (prefers-reduced-motion:reduce) { .flipbook-turn-sheet { animation-duration:.06s!important; } }
/* Integración con el aula y los visores del demo público, sin alterar su identidad gráfica. */
.classroom-inline-document .cdr-flipbook { margin:0; }
.classroom-inline-document .flipbook-stage { padding:18px 15px; }
.classroom-flipbook-loading { margin:0; padding:24px; text-align:center; color:#6b7f90; font-size:12px; }
.classroom-modal-viewer:has(.cdr-flipbook) { display:block; overflow:auto; height:min(78vh,860px); min-height:400px; }
.classroom-modal-viewer .cdr-flipbook { margin:0; border:0; border-radius:0; width:100%; }
.classroom-modal-viewer .flipbook-stage { padding:14px 25px; }
.classroom-modal-viewer .flipbook-status { padding:0; }
.classroom-modal-viewer .flipbook-hint { padding:0 16px 12px; }
@media(max-width:760px) { .classroom-modal-viewer:has(.cdr-flipbook){height:min(77vh,730px);min-height:340px} .classroom-modal-viewer .flipbook-stage{padding:15px 10px} }
